1

我目前对我所有的 ng-messages 使用这样的标记

<div ng-messages="myForm.fieldName.$error && (myForm.firldName.$dirty || myForm.$submitted)">
    <div ng-message="required">This field is required</div>
    <div ng-message="minlength">Your field is too short</div>
</div>

虽然有点乱,我想以某种方式覆盖或扩展 ng-messages 以便它自动检查该字段是否是脏的或该字段嵌套在其中的表单(通过走上 DOM 可能?)是 $提交。

我希望这是我网站中所有 ng 消息的默认行为,并且无法预见在未使用输入且未提交表单时需要显示错误消息的情况所以我认为覆盖这种行为是安全的,我只是不知道该怎么做。

我知道我可以完全替换 ng-messages,但是我必须重新创建该指令的所有默认行为,并且这些行为可能会在未来的角度版本中发生变化,所以我宁愿尽可能扩展它。我不知道 Angular 是否为此提供了任何钩子(我隐约听说过装饰器方法?)或者是否制作一个兄弟指令,比如“ng-custom-messages”,如果条件不是,它只是隐藏元素'没见过?

所以,我有几个想法,但我需要一点点推动来展示如何实现它们,如果有人觉得慈善,只需要一点骨架代码?

4

2 回答 2

0

不幸的是,这个问题的答案是编写一个新的表单指令,当提交发生时自动将所有字段设置为脏。

这是一小段代码......

angular.forEach( formCtrl , function ( formElement , fieldName ) {

    if ( fieldName[0] === '$' ){
        return;
    } 

    formElement.$setDirty();

}, this);

formCtrl.$setDirty();
scope.$apply();
于 2015-09-28T13:21:48.663 回答
0

我建议ngIf在使用ngMessages. 请注意,ngMessages接受(or )的$error属性。NgModelControllerFormController

<div ng-if="myForm.fieldName.$invalid && (myForm.fieldName.$dirty || myForm.$submitted)"
        ng-messages="myForm.fieldName.$error">
    <div ng-message="required">This field is required</div>
    <div ng-message="minlength">Your field is too short</div>
</div>

顺便说一句,您可能会发现使用它来$touched代替$dirty延迟错误反馈更合适,直到元素失去焦点(或表单已提交)。

于 2016-12-09T00:06:00.213 回答