如何使用 Angular-Xeditable 的 onBeforeSave / onAfterSave 方法并以超过 $data 作为参数

当第一次在我的应用程序中使用 Angular-Xeditable 时，我遇到了一个问题，试图找出如何将 x-editable 更改保存到通过 ng-repeat 循环访问的对象。

该文档主要侧重于使用 onbeforesave 和 onaftersave 进行验证，虽然它确实表明它可以用于保存内容，但示例并未显示如何将 $data （或 $index）以外的任何内容传递给 onbeforesave/onaftersave方法。示例显示保存类似 $scope.person 的内容，如果您有一项，那就没问题。

但如果 30 人名单中的第三个人被编辑了怎么办？你当然不想把它们全部拯救出来。如何仅保存已编辑的对象而不是数组中的所有内容？

Angular-Xeditable 文档并没有说得很清楚，但看起来 $data （和 $index）只是注入的值，你可以将几乎任何你想要的东西传递给保存/验证方法。所以你应该做的是传递对象本身（或者可能只是它的 id）。

给出以下标记：

<div ng-repeat="p in people">
    <a href="#" editable-text="p.name" onaftersave="updatePerson(p)">{{p.name}}</a>
</div>

然后，您的控制器中将包含以下代码：

$scope.updatePerson = function(person) {
    var ret = PersonService.save(person); // or whatever save mechanism you use
    // You need to return a error string if save fails, true otherwise
    if (ret !== null) {  // You have to make sure this logic works for your save service
        return ret;
    }
    return true; 
}

有了这个，您就可以按照您喜欢的方式处理保存。您不必只使用 Angular-Xeditable 提供的 $data 或 $index 值。你可以很容易地做这样的事情：

<div ng-repeat="p in people">
    <a href="#" editable-text="p.name" onaftersave="updatePerson(p.id, p.name, p.dohickey)">{{p.name}}</a>
</div>

并仅更新具有所提供 ID 值的人员的姓名和 dohickey 字段。当然，您必须更改 updatePerson() 方法，以将 ID 作为第一个参数，将名称和 dohickey 作为第二个和第三个参数。

另请注意，如果您像我在这里那样使用 onBeforeSave 而不是 onAfterSave，则 p.name 还没有新值，您需要返回使用 $data 来获取新值。