I want to pare two arrays using angular.equals and get list of items that are different from each other.

For example:

var obj1 = [
    { id: 1, name: 'john', age: 30, height: 6 },
    { id: 2, name: 'ben' , age: 20, height: 5 }
];
var obj2 = [
    { id: 1, name: 'martin', age: 25, height: 6 },
    { id: 2, name: 'ben'   , age: 20, height: 5 }
];

Now doing angular.equals(obj1, obj2) will return false.

Here I want to pare each item from different arrays and alert differences or show different color when I display in UI.

Assuming obj1 is from HTML form and obj2 is from service.

Result expected:

.id[1] name changed to john,age changed to 25
or
.get false or true when I pare each item in.

I want to pare two arrays using angular.equals and get list of items that are different from each other.

For example:

var obj1 = [
    { id: 1, name: 'john', age: 30, height: 6 },
    { id: 2, name: 'ben' , age: 20, height: 5 }
];
var obj2 = [
    { id: 1, name: 'martin', age: 25, height: 6 },
    { id: 2, name: 'ben'   , age: 20, height: 5 }
];

Now doing angular.equals(obj1, obj2) will return false.

Here I want to pare each item from different arrays and alert differences or show different color when I display in UI.

Assuming obj1 is from HTML form and obj2 is from service.

Result expected:

.id[1] name changed to john,age changed to 25
or
.get false or true when I pare each item in.

• javascript
• angularjs

Share Improve this question Follow edited Apr 11, 2015 at 10:51 Phú 4888 bronze badges asked May 29, 2014 at 6:30 user2927423user2927423 8111 gold badge11 silver badge22 bronze badges 5

• 1 There is no "out of the box" way of doing this in Angular. Ultimately, you just need to iterate through each array value and pare. Underscore/lodash may or may not help you beyond the Array.prototype methods available in JS. – Marc Kline Commented May 29, 2014 at 6:59
• Can you please share in JSFiddle if you have solution , I am struggling in paring and getting exact difference for each item. – user2927423 Commented May 29, 2014 at 7:09
• I don't have a solution because I haven't worked through the problem. It would be best for you to post a Fiddle of what you have and update your question with more specifics about what you've tried. – Marc Kline Commented May 29, 2014 at 7:10
• Marc Kline, I have updated the solution I tried here jsfiddle/Ebv3p/60 – user2927423 Commented May 29, 2014 at 7:28
• I updated it with just the very beginning of the diff you're looking for: jsfiddle/marcolepsy/Ebv3p/62 I used Underscore, which I imagine you'll want to continue using. I suggest being acquainted with the methods it offers as you consider the problem you're looking to solve. – Marc Kline Commented May 29, 2014 at 8:06

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 2

Angular doesn't have a built-in function for this. You should use the library deep-diff for this.

var first = [
    { id: 1, name: 'john', age: 30, height: 6 },
    { id: 2, name: 'ben' , age: 20, height: 5 }
];

var second = [
    { id: 1, name: 'martin', age: 25, height: 6 },
    { id: 2, name: 'ben'   , age: 20, height: 5 }
];

var result = diff(first, second);

// result => [
//    { kind: 'E', path: [0, 'name'], lhs: 'john', rhs: 'martin' },
//    { kind: 'E', path: [0, 'age' ], lhs: 30    , rhs: 25       }
// ]

As klode stated here, there is an option to deep pare using angular only without additional dependencies:

angular.equals(obj1, obj2)