Angular Xeditable - 无法使用 onbeforesave 事件获得正确的验证值答案

【问题标题】：Angular Xeditable - can't get correct value for validation using onbeforesave eventAngular Xeditable - 无法使用 onbeforesave 事件获得正确的验证值
【发布时间】：2017-12-20 15:49:28
【问题描述】：

我正在尝试将验证逻辑添加到我们使用的消息格式值的编辑中。我创建了 plunker here 来显示这个问题。这是花括号验证的代码。

vm.formatCheck = function (resource) {

console.log(resource.Value);

if (resource.Value.indexOf('{') > -1 || resource.Value.indexOf('}') > -1) {

    var x = resource.Value.split('{').length - 1;
    var y = resource.Value.split('}').length - 1;

    if ((x + y) % 2 === 1) {
        alert("Incorrect Message format");
        return;
    }

  }
};

示例：如果您编辑第一个值 ({JobRole} for {Organisation}) 并删除尾随花括号 ({JobRole} for {Organisation)

alert("Incorrect Message format"); 永远不会显示，因为它获取原始值 - {JobRole} for {Organisation} 而不是 {JobRole} for {Organisation

如果我将验证逻辑移至 onaftersave 事件，我会得到正确的值并触发验证，但它会显示/保存不正确的值，这是我不想要的。那么我该如何解决呢？任何帮助表示赞赏。

不确定我是否可以使用 defer，承诺解决这个问题 - 但不确定是否可以使用 Angular Xeditable？

【问题讨论】：

标签： javascript angularjs validation angular-xeditable

【解决方案1】：

这是我的工作人员：Plunker

基本上，我将您的 html 更改为：

<a href="#" e-name="resource" editable-textarea="res.Value" e-rows="5" e-cols="30"
                   onbeforesave="vm.formatCheck($data)"
                   onaftersave="vm.onGridItemChanged(res)">{{ res.Value || 'empty' }}</a></a>

我传递的是 $data 而不是“res”。 $data 是您实际更改的对象属性的值。

在控制器中，您的验证功能。 “资源”现在是 $data，其中包含您要更改的属性的值。因此，您检查它，然后返回一条错误消息。如果您不想在字段旁边显示错误消息，请返回 "";

vm.formatCheck = function (resource) {

        console.log(resource);

        if (resource.indexOf('{') > -1 || resource.indexOf('}') > -1) {

            var x = resource.split('{').length - 1;
            var y = resource.split('}').length - 1;

            if ((x + y) % 2 === 1) {
                alert("Incorrect Message format");
                return "Incorrect Message format";
            }

        }
    };

【讨论】：