Question

我有一个名为Message的服务，它从API返回消息。它看起来像这样：

app.factory('Message', function($resource) {
  return $resource('http://localhost:3000/messages/:id');
});

它工作正常，我在我的控制器中使用它来将消息分配给我的范围：

app.controller('MessagesCtrl', function($scope, Message) {
  $scope.messages = Message.query();
}

当我在浏览器的控制台中记录$scope.messages时，它看起来如下所示：

[$promise: Promise, $resolved: false]
  0: Resource
  1: Resource
  2: Resource
  3: Resource
  $promise: Promise
  $resolved: true
  length: 4
  __proto__: Array[0]

到目前为止，这么好 - 四条消息。我希望能够专门操作此集合中的元素，例如删除，更新和添加元素。

基于this answer，我试图删除具有特定ID的邮件：

$scope.messages = $scope.messages.filter(function(obj) {
  return (object.id != 6);
});

但是这会将$scope.messages变成空集合。如何通过id从这个资源集合中删除特定元素？另外，如何用另一个对象替换此集合中的现有元素？

Answer 1

$ resource会自动扩展promise（作为一种方便的方法）并将响应附加到返回的对象本身，这在将数据绑定到视图时非常方便（因为在promise解析后运行的摘要周期将更新DOM具有已解析数据的绑定对象），但在直接操作数据时尤其如此，尤其是在解析之前尝试访问数据时。因此，如果您想操纵数据，则需要等待承诺得到解决。

即： -

   //chain through the promise.
   Message.query().$promise.then(function(messages){
      $scope.messages = messages.filter(function(obj) {
       return (obj.id != 6);
      });
   });

或者您也可以（使用现有代码）：

  $scope.messages.$promise.then(function(messages){
     //Since you are overwriting the object here, there will no longer be a $Promise property so be careful about it when you try to chain through elsewhere after this
     $scope.messages = messages.filter(function(obj) {
       return (obj.id != 6);
      });
  });

操作从$ resource返回的集合

1 个答案: