$ resource remove（）之后的AngularJS更新视图

Question

我在$resource remove()之后更新视图时遇到问题。元素get已被删除，但您只能在刷新页面后看到更改。

控制器

this.getData = function() {
  var query = SomeService.query()
  query.$promise.then(function(res) {
    this.data = res; // Gets the data into view
  }.bind(this));
}

this.removeData = function(id) {
  var query = SomeService.remove({data_id: id})
   query.$promise.then(function(res) {
     this.getData() // Makes the request but doesn't update the view
     console.log(this.data) // Returns all the data, even the removed element
   }.bind(this))
}

工厂

.factory('SomeService', ['API_URL', '$resource', function (API_URL, $resource) {
  return $resource(API_URL + '/data', null, {
    create: {method: 'POST'},
    update: {method: 'PUT'},
});

知道我错过了什么吗？

Answer 1

好的，我找到了罪魁祸首。

我正在使用ngDialog，显然，我通过为对话框分配相同的controllerAs来创建同一个控制器的2个不同实例。如下所示：

ngDialog.openConfirm({
  controller: 'parentCtrl',
  controllerAs 'vm',
  template: '<span ng-click="vm.removeFeed(id)></span>'
})

修复方法是将范围对象传递给对话框： 这不是创建控制器的另一个实例，而是使用父/外部实例，更新$resource remove()上的视图。

ngDialog.openConfirm({
  scope: $scope,
  template: '<span ng-click="vm.removeFeed(id)></span>'
})

然而，这似乎是目前唯一的修复方法，除了inject $scope之外我别无选择只能进入父控制器。