fusionner deux tableaux d'objets avec Angular 2 et TypeScript?


92

J'ai parcouru les questions JavaScript sur ce sujet, cette question concerne spécifiquement Angular2 avec TypeScript.

Ce que j'essaye de faire est de concaténer les objets json dans un tableau.

Mon code ressemble à quelque chose comme ça,

public results: [];


public getResults(){
    this._service.get_search_results(this._slug, this._next).subscribe(
            data => {
                this.results.concat(data.results);
                this._next = data.next;
            },
            err => {
                console.log(err);
            }
        );
}

Comment puis - je concaténer data.resultsà this.resultsavec tapuscrit et angulaire?

this._sluget this._nextsont mis en classe.

Merci.

Réponses:


122

Je pense que vous devriez plutôt utiliser ce qui suit:

data => {
  this.results = this.results.concat(data.results);
  this._next = data.next;
},

Du concat doc :

La méthode concat () renvoie un nouveau tableau composé du tableau sur lequel il est appelé joint avec le (s) tableau (s) et / ou valeur (s) fournis en arguments.


1
malheureusement, cela ne fonctionne pas avec Uint8arrays :(
Frederick Nord

Peut échouer si this.results est nul ou non défini
Michael Freidgeim


35

Avec l' opérateur angulaire 6 et le concat ne fonctionnent pas. Vous pouvez le résoudre facilement:

result.push(...data);

est venu ici chercher une solution tout en conservant la référence d'objet entre les méthodes. cela a parfaitement fonctionné. merci
jgritten

Cela ne fusionne pas les tableaux, cela ajoute des données du second au premier. Bien qu'il puisse faire le travail, il faut faire attention car il modifie le tableau d'origine.
Davor le

5

Vous pouvez également utiliser le formulaire recommandé par ES6:

data => {
  this.results = [
    ...this.results,
    data.results,
  ];
  this._next = data.next;
},

Cela fonctionne si vous initialisez d'abord votre tableau ( public results = [];); sinon remplacer ...this.results,par ...this.results ? this.results : [],.

J'espère que cela t'aides


2

essaye ça

 data => {
                this.results = [...this.results, ...data.results];
                this._next = data.next;
            }

0

Supposons que j'ai deux tableaux. Le premier contient les détails de l'élève et les notes de l'élève. Les deux tableaux ont la clé commune, c'est-à-dire 'studentId'

let studentDetails = [
  { studentId: 1, studentName: 'Sathish', gender: 'Male', age: 15 },
  { studentId: 2, studentName: 'kumar', gender: 'Male', age: 16 },
  { studentId: 3, studentName: 'Roja', gender: 'Female', age: 15 },
  {studentId: 4, studentName: 'Nayanthara', gender: 'Female', age: 16},
];

let studentMark = [
  { studentId: 1, mark1: 80, mark2: 90, mark3: 100 },
  { studentId: 2, mark1: 80, mark2: 90, mark3: 100 },
  { studentId: 3, mark1: 80, mark2: 90, mark3: 100 },
  { studentId: 4, mark1: 80, mark2: 90, mark3: 100 },
];

Je souhaite fusionner les deux tableaux en fonction de la clé «studentId». J'ai créé une fonction pour fusionner les deux tableaux.

const mergeById = (array1, array2) =>
    array1.map(itm => ({
      ...array2.find((item) => (item.studentId === itm.studentId) && item),
      ...itm
    }));

voici le code pour obtenir le résultat final

let result = mergeById(studentDetails, studentMark);

[
{"studentId":1,"mark1":80,"mark2":90,"mark3":100,"studentName":"Sathish","gender":"Male","age":15},{"studentId":2,"mark1":80,"mark2":90,"mark3":100,"studentName":"kumar","gender":"Male","age":16},{"studentId":3,"mark1":80,"mark2":90,"mark3":100,"studentName":"Roja","gender":"Female","age":15},{"studentId":4,"mark1":80,"mark2":90,"mark3":100,"studentName":"Nayanthara","gender":"Female","age":16}
]
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.