使用带有Breeze的Angular验证指令阻止任何无效的输入

Question

如果将任何用于验证的角度指令(ng-minlength,ng-maxlength,ng-pattern等)添加到绑定到breeze实体的输入,则会阻止任何用户输入(如果发现无效).

如果ng-model的值最初有效,则显示,但如果将值更改为无效,则清除输入字段,模型将设置为null,并且您无法输入最初可能无效的任何内容.但是,如果将有效值复制到它显示的字段中.

如果模型值在无效时设置为null,如果它没有清除输入然后阻止更改,我会没事的.

此外,我有一种感觉,无论是什么导致这个问题也搞乱了ui-mask.没有角度验证指令就会发生同样的事情.

这是一个我从一个类似的问题找到的Plunker,我修改过来显示我的问题:http://plnkr.co/edit/dVsF7GFY65a30soLL5W8？p = preview

---

编辑

经过多个小时的研究,我找到了一个有效的解决方案,虽然我不确定是否有任何不良副作用.

它通过将$ modelValue设置为'undefined',如果它失败了任何验证器,因为它通过$ parsers和$ formatters来实现验证.

我在Angular(第16331行)中找到了这个代码,每个角度验证器调用它:

function validate(ctrl, validatorName, validity, value){
  ctrl.$setValidity(validatorName, validity);
  return validity ? value : undefined;
}

我将其更改为返回'value'而不是'undefined':

function validate(ctrl, validatorName, validity, value){
      ctrl.$setValidity(validatorName, validity);

      return value;
    }

Angular仍然可以正确设置验证.虽然我确信这不是最好的解决方案,甚至不是一个好的解决方案.

我怀疑当Angular将$ modelValue设置为'undefined'时会出现问题,然后Breeze看到模型已经更改并更新实体,然后更新模型然后清除输入等等......或类似的东西......

我发现这对我的任务很有帮助.也许对你们中的一个比我更了解的人会有所帮助.https://github.com/angular/angular.js/issues/1412

Answer 1

我很高兴看看你的笨蛋，看看 Breeze 是否可以对此做些什么。

我并不感到非常惊讶。我记得，当你将 Ng 与 HTML 5 验证结合起来时，它也会遇到困难。我认为你真的应该只使用一种方案。

你不同意吗？

另外，您是否考虑过Breeze Labs Breeze.directives.js中的 zValidate 指令？我们认为这是在视图中公开 Breeze 实体属性验证错误的最佳方式。