Question

我想使用$ resource在我们的服务器上进行RESTful更新，但是当用户点击我希望它在服务器发送响应之前不更新时，视图会立即更新。我正在使用具有使用休息资源的服务层的控制器。

模板：

<tbody>
    <tr ng-repeat="user in users">      
        <td><button class="radius tiny button" 
                ng-click="toggleUserActive(user)" 
                ng-bind="user.active ? 'Disable User' : 'Enable User'">
            </button>
        </td>
    <tr>
</tbody>

控制器：

angular.module('admin', ['admin.AdminService'])

  .controller('adminCtrl', function ($scope, adminService) {

    $scope.toggleUserActive = function(user){
      adminService.toggleUserDisabled(user).then(function(response){
        // Want the update to happen here
        user.active = response;
      });
    };

  });

服务：

angular.module('admin.AdminService', ['rest'])

  .service('adminService', function AdminService(UserRest){

    this.toggleUserDisabled = function(user) {
      user.active = !user.active;
      return UserRest.update(user).$promise.then(function(result){
        return result.active;
      });
    };

  });

休息服务：

angular.module('rest', ['config','ngResource'])

  .factory('RestEndpoint', function (apiEndpoint) {
    return {
      users: apiEndpoint + '/admin/users/:username'
    };
  })

  .factory('UserRest', function ($resource, RestEndpoint){
    return $resource(RestEndpoint.users, {username:'@username'},{
      update: {
        method: 'PUT'
      }
    });
  });

如果在响应恢复之前视图不会更新，我该怎么编码呢？

Answer 1

你可以在你的视图中使用这样的东西

ng-show="user.active"

将在使用该新数据更新$ scope后显示。

Answer 2

我目前没有使用其他服务，但是在使用API调用时，我使用了$ q和promises。你可以在控制器中使用$ q和promises，所以在收到响应之前控制器代码不会继续吗？

.controller('MyController', function($scope, $http, $q) {
    var JSON1 = $http.get('example1.json');
    var JSON2 = $http.get('example2.json');

    $q.all([JSON1, JSON2]).then(function(results) {
        ...
    });
})

AngularJS $资源|在承诺解决之前不要更新视图

2 个答案: