请注意,这与 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-model
和 ng-selected
。我认为这完全有道理并且不是 Angular 错误,ng-selected 只是不打算以这种方式使用。想想这段代码:
$scope.buttonClicked = function () {
$scope.slave = "Slave 1 selected";
$scope.master = "m2";
};
slave
的值应该是多少,应该选择哪个选项?你已经在代码中设置了这两个选项,angular 应该对 html select 做什么?它是否应该忽略您对“从”值的设置?如果 ng-selected
是 master
,它是否应该忽略 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/