同一个消息显示多次

Question

我正在使用角度版本1.5.5，最近升级到角度材料1.1.0。升级后，我开始面对ng消息中的几个问题。最初没有显示消息。我通过引用git issue

在下面添加了类来修复它

md-input-container .md-input-message-animation:not(.ng-animate) {
    opacity: 1;
    margin-top: 0px;
}

现在同一条消息多次显示。

<div class="inputbox-area" ng-form='subForm'>
    <md-input-container class="md-block" ng-repeat="item in dg.inputArr">
        <label>Level {{$index+1}}</label>
        <input md-maxlength="32" maxlength="32" ng-change="dg.showErrors = false"  name="{{item.Level}}" required ng-model="item.Name"  ng-pattern="/^[-a-zA-Z0-9,._' ]*$/" type="text">
        <div ng-messages="subForm[$index+1].$error" ng-if="dg.showErrors">
            <div ng-message="required">Level {{$index+1}} is mandatory</div>
            <div ng-message="md-maxlength">should be less than 32 characters long.</div>
            <div ng-message="duplicate">Level {{$index+1}} is a duplicate name</div>
            <div ng-message="pattern" class="my-message">Level {{$index+1}} is an invalid name</div>
        </div>
    </md-input-container>
</div>

我出错的任何建议？

Answer 1

<div class="inputbox-area" ng-form='subForm'>
    <md-input-container class="md-block" ng-repeat="item in dg.inputArr">
        <label>Level {{$index+1}}</label>
        <input md-maxlength="32" maxlength="32" ng-model-options="{ updateOn: 'submit' }" ng-change="dg.showErrors = false"  name="{{item.Level}}" required ng-model="item.Name"  ng-pattern="/^[-a-zA-Z0-9,._' ]*$/" type="text">
        <div ng-messages="subForm[$index+1].$error" ng-if="dg.showErrors">
            <div ng-message="required">Level {{$index+1}} is mandatory</div>
            <div ng-message="md-maxlength">should be less than 32 characters long.</div>
            <div ng-message="duplicate">Level {{$index+1}} is a duplicate name</div>
            <div ng-message="pattern" class="my-message">Level {{$index+1}} is an invalid name</div>
        </div>
    </md-input-container>
</div>    

问题是每次事件触发时您的模型都会更新，因此在输入框中添加ng-model-options="{ updateOn: 'submit' }"只有在您提交该表单时才会触发

Answer 2

Im not 100% sure, but i think ng-messages should refer to the name of the input field like this:

ng-messages="subForm.{{item.Level}}.$error"

I dont know if this sintax is gonna work, but try it out and see if it does.