fix(ngOptions): fix model<->option interaction when using track by

Closes #10869

Author: petebacondarwin

test/ng/directive/ngOptionsSpec.js

@@ -657,48 +657,61 @@ describe('ngOptions', function() {
     });
 
 
-    it('should update the selected item when only the properties on the object change (single)', function() {
+    it('should update the selected option even if only the tracked property on the selected object changes (single)', function() {
       createSelect({
         'ng-model': 'selected',
         'ng-options': 'item.label for item in arr track by item.id'
       });
 
       scope.$apply(function() {
-        scope.selected = {id: 10, label: 'new ten'};
+        scope.selected = {id: 10, label: 'ten'};
       });
 
-      expect(element.val()).toBe('10');
+      expect(element.val()).toEqual('10');
 
-      // Update the properties on the
+      // Update the properties on the selected object, rather than replacing the whole object
       scope.$apply(function() {
         scope.selected.id = 20;
         scope.selected.label = 'new twenty';
       });
 
-      expect(element.val()).toBe('20');
+      // The value of the select should change since the id property changed
+      expect(element.val()).toEqual('20');
+
+      // But the label of the selected option does not change
+      var option = element.find('option').eq(1);
+      expect(option.prop('selected')).toEqual(true);
+      expect(option.text()).toEqual('twenty'); // not 'new twenty'
     });
 
 
-    it('should update the selected item when only the properties on the object change (multi)', function() {
+    it('should update the selected options even if only the tracked properties on the objects in the ' +
+        'selected collection change (multi)', function() {
       createSelect({
         'ng-model': 'selected',
         'multiple': true,
         'ng-options': 'item.label for item in arr track by item.id'
       });
 
       scope.$apply(function() {
-        scope.selected = [{id: 10, label: 'new ten'}];
+        scope.selected = [{id: 10, label: 'ten'}];
       });
 
       expect(element.val()).toEqual(['10']);
 
-      // Update the properties on the
+      // Update the properties on the object in the selected array, rather than replacing the whole object
       scope.$apply(function() {
         scope.selected[0].id = 20;
         scope.selected[0].label = 'new twenty';
       });
 
+      // The value of the select should change since the id property changed
       expect(element.val()).toEqual(['20']);
+
+      // But the label of the selected option does not change
+      var option = element.find('option').eq(1);
+      expect(option.prop('selected')).toEqual(true);
+      expect(option.text()).toEqual('twenty'); // not 'new twenty'
     });