Question

假设我有一个$ scope变量selectedUser，它是在单击列表中的用户时设置的。我更新了selectedUser的属性，并向后端发送请求，使用匹配的id更新用户。当然在列出所有用户的ng-repeat中，属性正在更新，因为在完成更新后，我运行User.get（），它用新数据重新初始化ng-repeat列表。但是，当我然后使用相同的用户更新selectedUser变量但使用其新设置的属性时，对selectedUser的绑定不会更新。

本质上，我的问题是：如果在页面加载后更改$ scope变量，我如何使用新值更新绑定（或者您在视图中引用双花括号的任何内容）？

同样，$ scope.selectedUser对象已更新，但{{selectedUser.aProperty}}未更新。

感谢您的帮助！

Answer 1

通常在更新子作用域中的模型时遇到此问题（根据我的注释），但视图引用绑定到父作用域。

我已经创建了一个类似问题的人为例子here。

当您从子范围更改对象时，子范围将获取新对象，但父范围保留其旧副本，并且子范围的任何更改现在仅触及新对象。

HTML：

<!DOCTYPE html>
<html ng-app="test">

  <head>
    <script data-require="angular.js@1.3.0-beta.5" data-semver="1.3.0-beta.5" src="https://code.angularjs.org/1.3.0-beta.5/angular.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
  </head>

  <body ng-controller="RootCtrl">
    <!-- this is bound to my RootCtrl scope -->
    <h1>{{user.name}} ({{user.id}})</h1>
    <div ng-controller="ChildCtrl">
      <!-- this will inherit it's value from RootCtrl's scope until
           we overwrite it: -->
      <b>Name:</b> {{user.name}}
      <b>Id:</b> {{user.id}}
      <button ng-click="newUser()">New Id</button>
    </div>
  </body>

</html>

使用Javascript：

angular.module('test', [])
.controller('RootCtrl', function($scope) {
  $scope.user = {
    name: 'John',
    id: 12
  };
})
.controller('ChildCtrl', function($scope) {
  /* if you move this method to the parent scope,
   * both should update as expected. */
  $scope.newUser = function() {
    $scope.user  = { id: 100, name: 'Bob' };
  }
});

Answer 2

Ussualy当事件处理程序中的范围发生变化时，AngularJS应该更新所有绑定元素，但是如果它不能手动调用$scope.$apply()。

另外，请检查模块生命周期中的this post about when to use $scope.$apply。

一旦变量在AngularJS中更改值，如何更新数据绑定？

2 个答案: