请注意,这与 stackoverflow 上 99% 的相关问题相反。

我的问题是:我有一个依赖选择,当“主”选择更改时,“从” View 会更新,但不是模型。奇怪的。

示例代码:

<!DOCTYPE html>
<html ng-app>

<head>
  <script src="https://code.angularjs.org/1.3.5/angular.js"></script>
</head>

<body>
  <select ng-model='master'>
    <option value='m1'>Master 1</option>
    <option value='m2'>Master 2</option>
  </select>
  <select ng-model='slave'>
    <option value='Slave 1 selected' ng-selected='master == "m1"'>Slave 1</option>
    <option value='Slave 2 selected' ng-selected='master == "m2"'>Slave 2</option>
  </select>
  {{ slave }}
</body>

</html>

更改主选择时,您可以看到选择更改但不是绑定(bind) {{ slave }} 的打印值。

plunker 链接:http://plnkr.co/edit/LjaKgTTfBlczkGuCIhZ1

最佳答案

Angular 根据模型更改更新 View ,并根据用户与 View 的交互更新模型。通过使用 ng-selected 手动更改所选选项,angular 没有看到用户选择新选项,因此不会更新 slave 。并且由于 slave 自上次在控件上设置所选选项以来没有更改,因此不会更新所选选项。我认为您不应该同时使用 ng-modelng-selected。我认为这完全有道理并且不是 Angular 错误,ng-selected 只是不打算以这种方式使用。想想这段代码:

$scope.buttonClicked = function () {
  $scope.slave = "Slave 1 selected";
  $scope.master = "m2";
};
slave 的值应该是多少,应该选择哪个选项?你已经在代码中设置了这两个选项,angular 应该对 html select 做什么?它是否应该忽略您对“从”值的设置?如果 ng-selectedmaster ,它是否应该忽略 m2 属性,该属性表示它应该选择从站 2?假设您将 master 设置为 m1 ,这会导致 ng-selected 将所选选项设为从属 1。如果用户随后将选项更改为从属 2 怎么办? ng-selected 选项不正确。

如果你想在master改变时一次性设置slave的值,你应该创建一个watch来在值改变时运行代码:
$scope.$watch('master', function(newValue, oldValue) {
  if (newValue == 'm1') {
    $scope.slave = 'Slave 1 selected';
  } else if (newValue == 'm2') {
    $scope.slave = 'Slave 2 selected';
  } else {
    $scope.slave = undefined;
  }
});

关于Angularjs 更新 View 但不更新模型,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/27387680/

10-09 18:21
查看更多