Question

以下是Plunker：http://plnkr.co/edit/aqLnno?p=preview

我有一个要在ng-grid中显示的人员列表（$scope.persons）。每行都有一个编辑按钮。当用户点击按钮（ng-click="edit(row)"）（参见下面的代码）时，我会复制显示的人（angular.copy(row.entity)）并打开模态对话框。 ......到目前为止一切顺利。

当用户点击＆＃34;取消＆＃34;在模态上，没有任何反应。当用户点击＆＃34;保存＆＃34;在模型上，修改后的人员将被退回并且应该被重新整合并且＃34;在$scope.persons。

这就是问题出现的地方：我在$scope.persons中搜索找到正确的人并将其替换为从模态返回的人。日志语句显示修改前后的$scope.persons，一切看起来都不错。然而，ng-grid似乎并不关心。它仍然在不同的（旧的）$scope.persons上运行。

如果我取消注释row.entity = person并直接设置行，那么ng-grid中的一切看起来都很好。但是，由于基础数据模型未正确更改，度假村将再次启动旧的（未修改的）人员。

以下是我编辑功能的代码：

$scope.edit = function(row) {
  $modal.open({
    templateUrl: 'personEdit.html',
    backdrop: true,
    windowClass: 'modal',
    controller: 'PersonModalInstanceCtrl',
    resolve: {
      person: function() {
        return angular.copy(row.entity);
      }
    }
  })
    .result.then(function(person) {
      $log.log('Edited person: ' + JSON.stringify(person));
      angular.forEach($scope.persons, function(p, index) {
        $log.log('p: ' + JSON.stringify(p) + ' index: ' + index);
        if (p.id == row.entity.id) {
          $log.log('scope: ' + JSON.stringify($scope.persons));
          $scope.persons[index] = person;
        }
      });
      $log.log('scope: ' + JSON.stringify($scope.persons));
      // row.entity = person;
    }, function() {});
};

我的示波器出了什么问题？

感谢您的帮助

Answer 1

行。再学到一些东西。 jantimon的回答指出了我正确的方向。但我不喜欢他如何更改我的$ scope.persons数组（我从RESTful GET获取此数组，并且喜欢我可以使用返回的JSON作为$ scope.persons而无需修改）。

无论如何，这是解释：

从原始的$ scope.persons列表中复制我的人时，我在新的内存位置创建了一个新对象：

angular.copy(row.entity)

这是必要的，因为用户可以“取消”他的编辑。

当用户点击“保存”时，我必须将此复制的人放回$ scope.persons而不是旧的。我是这样做的：

$scope.persons[index] = person;

虽然这是正确的并且给出了期望的结果（如日志语句所示），但人[索引]现在指向不同的内存位置。

但是：ng-grid内部仍然指向旧的内存位置！ ng-grid没有记住指针（person [index]）作为数据模型，而是记住了原始指针的目的地（* person [index]）[抱歉我的C时尚说话]。我认为这是ng-grid恕我直言的BUG。

所以我需要做的就是将新人复制回它所来自的完全相同的存储位置。幸运的是，有一个角度指令：

angular.extend($scope.persons[index], person);

如果你只是替换$ scope.persons [index] = person;与angular.extend（$ scope.persons [index]，person）;一切正常。

Answer 2

在更改阵列时，看起来ng-grid没有正确更新

您可以在此示例中保留行实体的指针：http://plnkr.co/edit/0lDoKOg4kXXa51NlSuMg?p=preview

它使用$scope.persons[index].data = person.data;代替$scope.persons[index] = person;。

从模态返回数据时，ng-grid中的范围混淆

2 个答案: