Question

更改输入时，表单输入错误消息和表单条目不会更新。

我试图改用表格而不是ng-form，尝试了不同类型的验证（必填，电子邮件，模式等）。

我正在使用角度1.7 角材1.1.9 angualr-messages 1.7

此表单在表格> tbody中

<ng-form name="editedJiraForm">
<tr md-row ng-repeat="task in jira.tasks track by $index">
    <td md-cell>
        <md-input-container>
            <label>Title</label>
            <input name="title" ng-model="editedJira.title" required>
            <div ng-messages="editedJiraForm.title.$error" md-auto-hide="false">
                <div ng-message="required">Title required</div>
            </div>
        </md-input-container>
    </td>
    <td md-cell>
        <md-input-container>
            <label>Description</label>
            <textarea name="description" ng-model="editedJira.description" md-maxlength="5000" rows="3" md-select-on-focus required></textarea>
            <div ng-messages="editedJiraForm.description.$error" md-auto-hide="false">
                <div ng-message="required">Description required</div>
            </div>
        </md-input-container>
    </td>
    <td md-cell>
        <md-input-container>
            <label>Priority</label>
            <input name="priority" ng-model="editedJira.ubi_priority" ng-pattern="/^(01|02|03)$/"/>
            <div ng-messages="editedJiraForm.priority.$error" md-auto-hide="false">
                <div ng-message="pattern">Invalid priority</div>
            </div>
        </md-input-container>
    </td>
    <td md-cell>
        <md-input-container>
            <label>Estimation</label>
            <input name="estimation" ng-model="editedJira.estimation" ng-pattern="/^\d+(.\d+)?$/">
            <div ng-messages="editedJiraForm.estimation.$error" md-auto-hide="false">
                 <div ng-message="pattern">Invalid estimation, use int or float</div>
            </div>
        </md-input-container>
    </td>
    <td md-cell>
        <md-button ng-disabled="editedJiraForm.$invalid" class="md-fab md-primary md-mini" aria-label="validate" ng-click="editJira(selection.feature, $index, true)">
             <md-icon md-svg-src="static/images/validate.svg"></md-icon>
        </md-button>
        <md-button class="md-fab md-primary md-mini" aria-label="cancel" ng-click="editJira(selection.feature, $index)">
             <md-icon md-svg-src="static/images/cancel.svg"></md-icon>
        </md-button>
    </td>
</tr>
</ng-form>

我希望有 -例如，当优先级与模式不匹配时显示的消息。 -同样，当表单无效时，应禁用验证按钮。

尽管就我而言： -当不遵守模式或要求但消息未显示时，输入字段会变为红色。 -验证按钮始终处于活动状态。

当在html中显示editedJiraForm时，它在我编辑表单时没有更新，也许是一个问题吗？

Answer 1

好吧，如果有人遇到类似的问题，我从there那里找到了答案

这是由于将表格分成几部分而导致的。

解决方案是删除实际元素，并通过在元素上使用ng-form name =“ editedJiraForm”来替换它。

这给出了以下代码：

<tr ng-form name="editedJiraForm">
    <td md-cell>
        <md-input-container>
            <label>Title</label>
            <input name="title" ng-model="editedJira.title" required>
            <div ng-messages="editedJiraForm.title.$error" md-auto-hide="false">
                <div ng-message="required">Title required</div>
            </div>
        </md-input-container>
    </td>
    <td md-cell>
   ....
    </td>
</tr>

角材料形式验证和错误未正确显示

1 个答案: