merge two object arrays with Angular 2 and TypeScript?
ArraysTypescriptAngularArrays Problem Overview
I have gone across the JavaScript questions on this topic, this question is specifically about Angular2 with TypeScript.
What I am trying to do is to concatenate the json objects to an array.
My code looks something like this,
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);
}
);
}
How can I concatenate data.results
to this.results
with typescript and angular?
this._slug
and this._next
are set on class.
thanks.
Arrays Solutions
Solution 1 - Arrays
The spread operator is kinda cool.
this.results = [ ...this.results, ...data.results];
> The spread operator allows you to easily place an expanded version of an array into another array.
Solution 2 - Arrays
I think that you should use rather the following:
data => {
this.results = this.results.concat(data.results);
this._next = data.next;
},
From the concat
doc:
> The concat() method returns a new array comprised of the array on which it is called joined with the array(s) and/or value(s) provided as arguments.
Solution 3 - Arrays
With angular 6 spread operator and concat not work. You can resolve it easy:
result.push(...data);
Solution 4 - Arrays
You can also use the form recommended by ES6:
data => {
this.results = [
...this.results,
data.results,
];
this._next = data.next;
},
This works if you initialize your array first (public results = [];
); otherwise replace ...this.results,
by ...this.results ? this.results : [],
.
Hope this helps
Solution 5 - Arrays
> Assume i have two arrays. The first one has student details and the > student marks details. Both arrays have the common key, that is > ‘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 },
];
> I want to merge the two arrays based on the key ‘studentId’. I have > created a function to merge the two arrays.
const mergeById = (array1, array2) =>
array1.map(itm => ({
...array2.find((item) => (item.studentId === itm.studentId) && item),
...itm
}));
> here is the code to get the final result
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}]
Solution 6 - Arrays
try this
data => {
this.results = [...this.results, ...data.results];
this._next = data.next;
}