1

我正在尝试找到一种方法，以类似于 MVC 中的 ASP.NET(Validation Error) 的方式在 HTML 表中正在编辑的字段下方显示验证错误消息。

任何样品或链接将不胜感激。

这是我尝试过的。它不会立即更新错误消息，因为我认为它不是可观察的。

<script id="editTmpl" type="text/html">
   <tr>
       <td><input data-bind="value: Country_Code "/>

            <div data-bind="if: $data.entityAspect.getValidationErrors().length>0">
             <pre data-bind="text:  $data.entityAspect.getValidationErrors('Country_Code')[0].errorMessage "></pre>
        </div>


       </td>
       <td><input data-bind="value: Country_Name"/></td>
        <td class="buttons">
            <a class="btn btn-success" data-bind="click: $root.save" href="#" title="save"><i class="icon-ok"></i></a>
            <a class="btn" data-bind="click: $root.cancel" href="#" title="cancel"><i class="icon-trash"></i></a>
        </td>
   </tr>
</script>
4

1 回答 1

5

你是对的，这getValidationErrors不是一个可观察的淘汰赛。它只是一个返回实体当前 Breeze 验证错误集合的函数。

但是有一个事件可以用来监听该集合的变化。在有事件的地方，有一种方法可以创建可以绑定的 KO observable。这是将这种可观察对象添加到实体的一种方法。

功能 addhasValidationErrorsProperty（实体）{

     var prop = ko.observable(false);

     var onChange = 函数 () {
         var hasError = entity.entityAspect.getValidationErrors().length > 0;        
         if (prop() === hasError) {
             // 即使实体网络错误状态未更改，集合也已更改
             prop.valueHasMutated(); // 强制通知
         } 别的 {
             道具（有错误）；// 改变值并通知
         }
     };

     onChange(); // 现在检查 ...
     entity.entityAspect // ...以及当错误集合发生变化时
         .validationErrorsChanged.subscribe(onChange);

     // observable 属性被连接起来；现在将其添加到实体
     entity.hasValidationErrors = 道具；
}

然后你应该能够写出类似的东西：

  <div data-bind="if: hasValidationErrors">
     <pre data-bind="text: $data.entityAspect.getValidationErrors('Country_Code')[0].errorMessage "></pre>
  </div>

该addhasValidationErrorsProperty方法在 DocCode:validationTests.js 中的“使用 validationErrorsChanged 触发 KO 计算属性”测试中执行

如果您喜欢它，您可能希望在此处讨论EntityType的构造后初始化程序中调用它。

额外学分

我不喜欢

$data.entityAspect.getValidationErrors('Country_Code')[0].errorMessage

我希望我可以把它变成每个 Breeze 实体的函数，但 Breeze 实体没有基本类型。

您可以使用此类函数扩展特定 Breeze 实体类型的原型。这样做的最佳时机可能是在您使用hasValidationErrors属性配置该类型时。

假设我们正在使用Employee实体类型。在应用程序引导的早期，我们可以编写：

var store = manager.metatdataStore; // 获取 MetadataStore 的一种方法

// 一个虚拟的员工构造函数；也许你有一个真正的
var employeeCtor = function() {};

// 用辅助方法扩展它的原型
employeeCtor.prototype.getFirstValErrMsg = function (pname) {
        var errs = this.entityAspect.getValidationErrors(pname);
        返回（错误长度）？错误[0].errorMessage：“”；
    };

// 同时注册 ctor 和初始化器
store.registerEntityTypeCtor(
       “员工”，
       employeeCtor, // 自定义 ctor
       addhasValidationErrorsProperty); // 初始化器

现在你应该可以像这样绑定了：

  <div data-bind="if: hasValidationErrors">
     <pre data-bind="text: $data.getFirstValErrMsg('Country_Code')"></pre>
  </div>

我已经测试了这种方法的一些部分（例如getFirstValErrMsg扩展和addhasValidationErrorsProperty方法），但我还没有完全了解整个事情。也许您可以为我们采取下一步行动并报告您的发现。

于 2012-12-29T10:40:36.823 回答