Angularjs 角度：ng选项，在更新时同时替换数组和模型值

我正在研究一个模型，该模型针对每个属性更新，将其自身发送到服务器并重新计算。由于大多数属性都是基于列表的，所以我广泛使用了

/“下拉列表”

关于如何设置逻辑的示例：

{
  NumberList: ['123', '456', '789']
  Number: 0
}

用户从

NumberList

中选择“123”，服务器用

{
  NumberList: ['123', '456', '789']
  Number: 123,
  OtherNumberList: ['999', '888', '777'],
  OtherNumber: 0
}

我的问题是，一旦用户选择123，它就不会“粘住”视图。选择列出“闪烁”（缺少更好的说明）并恢复为0/空选项。但是，在模型中，该特性得到了正确反映

基于一个类似的老问题，我尝试了ng repeat。这几乎是可行的，但奇怪的是在某些属性上失败了

<select class="form-control" ng-model="model.Number" ng-change="mCtrl.updateModel(index)">
    <option ng-repeat="Number in model.NumberList" value="{{Number}}" ng-selected="model.Number == Number">{{Number}}</option>
</select>

---

您的问题是更新模型对象并用新对象替换它，所以对旧对象的属性的绑定保持不变。 看这把小提琴：

第一个控制器做你正在做的事情

第二个更新模型，而不是替换它

var app = window.app = angular.module('app', [])

app.controller('Ctrl',['$scope','$timeout', function ($scope, $timeout) {
    this.model = {       
      NumberList: ['123', '456', '789'],
      Number: 123
    }

    this.postBack = function() {        
        $timeout(function() {
            this.model = {
              NumberList: ['123', '456', '789'],
              Number: 123,
              OtherNumberList: ['999', '888', '777'],
              OtherNumber: 0
            }               
        }.bind(this))       
    }.bind(this)   
}])

app.controller('Ctrl2',['$scope','$timeout', function ($scope, $timeout) {
    this.model = {      
      NumberList: ['123', '456', '789'],
      Number: 123
    }

    this.postBack = function() {        
        $timeout(function() {
            this.model.OtherNumberList=['999', '888', '777']
            this.model.OtherNumber= 0         
        }.bind(this))        
    }.bind(this)    
}])

---

你的提问是对的，但你的假设是错的：

我唯一剩下的想法是，因为列表是 字符串，而数字是一个数字，则存在类型不等。 但是我假设ngOptions不进行类型检查

。。。因为ngOptions指令使用

==

来设置所选值。如果希望在服务器响应后保持选择，则需要匹配这些类型

另一个音符 正如您在问题的评论和另一个答案中指出的那样，您也可能会遇到源于将新对象重新分配给模型的问题，而无论如何，您可能应该扩展现有对象

您可以使用

angular.extend

，而无需对代码进行太多更改：

'update': function (index, model) {
...
     angular.extend(MyService.listOfModels[index], model );
...
}

---

您的问题很可能是因为您正在重新分配对象，而不是扩展对象，这意味着您正在破坏模型并重新创建它，这可能会导致np options自行重置它。你能发布你的更新逻辑吗？或者创建一个fiddler？？你是对的：整个对象在服务器端重新创建，并在数组中用更新的自身替换。我将添加更新逻辑的一个片段。是否尝试扩展对象而不是重新创建它？这是我最糟糕的情况，因为模型非常复杂。因此，如果我要这样做，我必须确保我已经尝试了所有其他的可能性。为什么不从模型中取出元素选择选项，并根据需要进行更新：）我发现销毁和替换对象也会创建新的绑定。但是我不明白为什么默认值没有正确设置，而是恢复为0。那么它适用于哪些属性，哪些属性不适用？用于选择源列表是对象列表的位置？所有列表都是数字字符串。然而，可能有一些格式将它们分开（十进制与非十进制）。我得去看看。谢谢！

var app = window.app = angular.module('app', [])

app.controller('Ctrl',['$scope','$timeout', function ($scope, $timeout) {
    this.model = {       
      NumberList: ['123', '456', '789'],
      Number: 123
    }

    this.postBack = function() {        
        $timeout(function() {
            this.model = {
              NumberList: ['123', '456', '789'],
              Number: 123,
              OtherNumberList: ['999', '888', '777'],
              OtherNumber: 0
            }               
        }.bind(this))       
    }.bind(this)   
}])

app.controller('Ctrl2',['$scope','$timeout', function ($scope, $timeout) {
    this.model = {      
      NumberList: ['123', '456', '789'],
      Number: 123
    }

    this.postBack = function() {        
        $timeout(function() {
            this.model.OtherNumberList=['999', '888', '777']
            this.model.OtherNumber= 0         
        }.bind(this))        
    }.bind(this)    
}])

'update': function (index, model) {
...
     angular.extend(MyService.listOfModels[index], model );
...
}