javascript - 如何使用 Angular 验证表行数据？

Question

我有 table 和 ng-repeat 表格行。我想对单行数据进行内联编辑和验证，但不可能在表格内使用 form 或 ng-form 。 对于内联编辑，我在 td 中使用带有 ng-show 的输入。 所以，我有两个问题:

1. 内联编辑的方法是否正确？ (使用隐藏输入 在 td 内)。

2. 如何验证行中的数据？

更新:我想要表格行类似于“表单提交”的东西，并为包含错误数据的表格单元格添加错误类。

我是 Angular 的新手。

Answer 1

NG-Form 适用于非 HTML 表单的元素。因此，您应该能够在表格中使用内置的 ng-form 验证。对我来说，它似乎每行都正确地跟踪了表格。

https://docs.angularjs.org/api/ng/directive/form

 <tr ng-repeat="market in markets | orderBy:'name'" ng-form name="myForm">
   <td>{{market.id}}</td>
   <td ng-class="{'has-error': !myForm.minimum.$valid}">
     <input type="number" name="minimum" min="0" max="10000" ng-model="market.minimum" />
   </td>
   <td ng-class="{'has-error': !myForm.cash.$valid}">
    <input type="number" ng-model="market.cash" min="0" name="cash" />
  </td>
  <td>
    <input type="submit" ng-disabled="!myForm.$valid" ng-click="save(market)"/>
  </td>
</tr>