Question

我使用的代码非常类似于我多次使用但由于某种原因，我的一个变量决定不在范围内更新，我不明白为什么。

在这里你可以看到我绑定到一个变量＆＃39; UserGroupsSelectedToBeMoved＆＃39;

<select multiple="" class="form-control" size="8" ng-model="UserGroupsSelectedToBeMovedBack">
    <option ng-repeat="ChosenUserGroup in Audit.UserGroups" value="{{ChosenUserGroup.Id}}">{{ChosenUserGroup.Name}}</option>
</select>

因此，当选择任何内容时，变量将在范围内更新。很容易......但它没有更新。 $ scope.UserGroupsSelectedToBeMoved始终为null，除非我在控制器中指定它。

如果我写，

{{UserGroupsSelectedToBeMoved}}

在我的html中，我可以看到当我点击时值的变化。如果我在控制器中设置变量的值，它将正确显示在html中以及页面加载时。但它只是在用户点击时不会在范围内更新，尽管事实上我可以在html中看到它更新。我无法理解为什么会这样。

修改

通过使用ng-change改变我的选择来解决这个问题，

<select class="form-control"
        size="8"
        multiple
        ng-model="UserGroupsSelectedToBeMoved"
        ng-options="userGroup.Id as userGroup.Name for userGroup in AvailableUserGroups"
        ng-change="ChangeSelectedValueToMove(UserGroupsSelectedToBeMoved)"></select>

然后在我的控制器中使用这种方法，

$scope.ChangeSelectedValueToMove = function (selectedIds) {
    $scope.UserGroupsSelectedToBeMoved = selectedIds;
}

考虑到我发布的原始代码似乎在我的项目的其他地方工作得很好，但它现在很有效。

Answer 1

您应该阅读Understanding Scopes。

我强烈建议你这样做。你发生的事情可能是直接将直接绑定到原始变量（string，int等）的范围问题。

因此，始终将这些内容置于某个对象下，以便您拥有ng-model="MyContainer.MyParameter"结构，这是最佳做法。

所以基本上，改变它以使用这种做法，并阅读文章：）

AngularJS：变量未在范围内更新

1 个答案: