Angular：两个光滑网格，同一页面答案

【问题标题】：Angular: two slickgrids, same pageAngular：两个光滑网格，同一页面
【发布时间】：2017-06-13 06:23:27
【问题描述】：

我是 Angular 的新手，所以请不要对我太苛刻。我正在尝试编辑此示例：https://github.com/fortesl/angular-slickgrid-example 以使用两个网格。

这是工作的 plunker：http://plnkr.co/edit/RyAwvqZ9sr3b9YFvmK2X 问题是，当您双击第一个网格上的任何行时，它会被删除。但是，它不适用于第二个网格。

解决这个问题的最简单方法是在控制器中创建第二个 deleteTask 方法：

self.deleteTask2 = function(row) {
  self.data2.splice(row.row, 1);
}

并更改第二个网格的属性以使用此功能。

但是，这种方法似乎并不正确。如果会有第三个/第四个等网格怎么办？有没有一种方法可以使 deleteTask 成为指令的一部分，而不是作用域？

提前致谢！

【问题讨论】：

仅供参考，6pac repo 有一个动态创建多个网格的示例

标签： angularjs slickgrid

【解决方案1】：

只需修改deleteTask 函数以获取您要从中删除的数据数组。

Working, modified version of the Plunker code

控制器：

self.deleteTask = function(data, row) {
    data.splice(row.row, 1);
}

查看：

<div my-grid style="width:600px;height:200px;" grid-columns="gridCtrl.columns"
     grid-options="gridCtrl.options" grid-data="gridCtrl.data"
     edit-row="gridCtrl.deleteTask(gridCtrl.data, row)" class="container myGrid">
</div>

【讨论】：

是的，这很尴尬。感谢您的回答！但是我们用 grid-data="gridCtrl.data" 绑定数据。有没有办法在函数中使用这个事实？
你的意思是如果edit-row 隐式地将grid-data 绑定传递给提供的函数？据我所知，这不会发生。它纯粹调用函数，并提供参数。
我仍在阅读 Github 上的代码，所以我可能会看到一些改变我的答案的东西。不过，目前，这很有效，并且应该可以很好地与 ngRepeat 配合使用（如果这样做，请记住不要使用 ID）。
每个实例的数组将是我这样做的方式，是的。这样，您可以使用 ngRepeat 对其进行迭代，并且 edit-row 属性将自动连接到正确的数据集。如果您想将它放在 $scope 中或将其保留为控制器的属性，这是您的选择，就像它已经存在一样。这是一个工作示例。正如我所说，我仍在查看 Github 上的源代码，看看是否有办法从范围/上下文中获取数据。
糟糕，不小心删除了指向 ngRepeat 示例的链接。 Here it is.