Html 如何验证使用 ngrepeat、ngshow (angular) 动态创建的输入

发布于08月21日

我有一个使用NG-Repeat创建的表.我想向表中的每个元素添加验证.问题是每个输入单元格与其上方和下方的单元格具有相同的名称.我try 使用{{$index}}值来命名输入，但是尽管HTML中的字符串文字看起来是正确的，它现在仍然有效.

以下是我目前的代码:

<tr ng-repeat="r in model.BSM ">
   <td>
      <input ng-model="r.QTY" class="span1" name="QTY{{$index}}" ng-pattern="/^[\d]*\.?[\d]*$/" required/>
      <span class="alert-error" ng-show="form.QTY{{$index}}.$error.pattern"><strong>Requires a number.</strong></span>
      <span class="alert-error" ng-show="form.QTY{{$index}}.$error.required"><strong>*Required</strong></span>
   </td>
</tr>

我已经try 将{{}}从索引中删除，但也不起作用.到目前为止，输入的验证属性工作正常，但是没有显示错误消息.

有人有什么建议吗？

Edit:除了下面的精彩答案外，这里还有一篇博客文章更详细地报道了这个问题:http://www.thebhwgroup.com/blog/2014/08/angularjs-html-form-design-part-2/

<div ng-repeat="social in formData.socials"> <ng-form name="urlForm"> <input type="url" name="socialUrl" ng-model="social.url"> <span class="alert error" ng-show="urlForm.socialUrl.$error.url">URL error</span> </ng-form> </div>

Html 如何验证使用 ngrepeat、ngshow (angular) 动态创建的输入

推荐答案

Html相关问答推荐

放大缩小标题在外面的图像

如何使我的组织 struct 图的连接线响应？

如何在htmlAngular 17的@for中使用索引

在窄屏幕上显示表格，每个单元格占一行

有没有办法根据另一个项目调整FlexBox项目的大小？

根据屏幕大小拆分长行列表

我的Django应用程序中出现模板语法错误

创建特定的CSS网格布局

为什么 Select 元素在带有数据绑定的Blazor上行为怪异？

元素offsetTop在滚动容器中时没有更改

如果您将带有 html 标签的字符串数据(name ： test) 放在 `
` 中，则这些标签不起作用

如何使用 HTML 将对象数组发送到 Nodejs Express

即使必填字段为空，HTML 表单也已成功提交

嵌入最近的 YOUTUBE 视频(不是短片，视频)

如何使用CSS将页面标题水平居中对齐

如何让 backdrop-filter： blur() 效果在 iOS 上运行？

如果不透明的元素出现在下方，为什么不透明度会使一个元素出现在另一个元素上方？

我正在使用 react-router-dom 并创建了一个固定的导航栏，它在每个网页上不断改变大小，我不知道为什么

如何将我的输入值固定到 2022 年 12 月？

CSS 变量不适用于自定义属性回退值