angularjs - Restangular 响应和 ng-repeat

Question

我最近开始学习使用 restangular 与我的 restfull API (sails) 对话的 angularjs。我偶然发现的问题是，在我更改范围内的列表后，ng-repeat 不会更新。

Controller :

app.controller('UsersCtrl', ['UsersSvc', '$scope', function(UsersSvc, s) {
    UsersSvc.getList().then(function (new_users) {
        s.users = new_users;
    })
    s.destroy = function (user) {
        user.remove().then(function () {
        s.users = _.without(s.users, user);
    });
}
}]);

服务:

app.factory('UsersSvc', function(Restangular) {
    return Restangular.all('users');
});

模板:

<div ng-controller="UsersCtrl">
    ...
    <tr ng-repeat"user in users">  
          <td>{{user.firstName}}</td>  
          <td>{{user.lastName}} </td>  
          <td>{{user.emailAddress}}</td>  
          <td>{{user.age}}</td>  
    </tr> 
    ...
</div>

当我检查范围时，restangular 对象数组已正确分配给用户 Controller 的范围，但模板拒绝更新。

提前致谢

Answer 1

AngularJS(和 javascript)关心引用与覆盖。所以为了安全起见，我总是首先设置我的范围变量，然后使用 angular.copy() 或 Restangular.copy() 进行更新(如果它是一个 Restangular 对象) .

下面是我将如何重构您的 Controller 以确保绑定(bind)和摘要循环保持连接。

(请注意，我将 s 重命名为“传统”$scope，以便于其他人阅读)

app.controller('UsersCtrl', ['$scope', 'UsersSvc', 'Restangular', function($scope, UsersSvc, Restangular) {

    // we're expecting a list, so default as array
    $scope.users = [];

    UsersSvc.getList().then(function (new_users) {
        // In normal $resource/ng projects use: angular.copy(src, dst) but
        // Restangular has an issue when using angular.copy():
        // https://github.com/mgonto/restangular/issues/55
        // so use their version of copy():
        Restangular.copy(new_users, $scope.users);
    });

    $scope.destroy = function (user) {
        user.remove().then(function () {
        $scope.users = _.without($scope.users, user);
    });
}
}]);