Question

示例代码：

<table>
    <tr>
        <td>Class</td>
        <td> Input one </td>
        <td> Input two </td>
        <td> Total </td>
    </tr>
    <tr ng-repeat= "x in records">
        <td>My {{x.class}} </td>
        <td><input type="tel" ng-value="x.tel" ng-model="telephone"></td>
        <td><input type="tel" ng-value="x.inone" ng-model="inone"></td>
        <td><input type="tel" ng-value="x.intwo" ng-model="intwo"></td>
        <td><input type="tel" ng-value="x.total" ng-model="total"></td>
    </tr>   
    <tr>
        <td colspan="5" class="text-center"> <input type="button" value="Save" ng-click="mydata(records)"> </td>
    </tr>
</table>

最初，重复记录仅包含缺省情况的详细信息。

$scope.records = [
       {
            "class" : "Personal",

        },
        {
            "class" : "Socail",

        },
    ]

提交后，angular会动态添加用户填写的字段

Intially用户只能看到

1.Class部分有3个空白输入字段，用于inone，intwo和total和一个空白电话字段。

我想要什么

1.应该对

的电话领域进行验证

A. Personal class which allow only 6 digits, and 

B. for Social class it should allow 10 digits.

在Personal的inone字段中输入值的范围是0-10，而intwo字段是11-30。
在Social的inone字段中输入值的范围是30-40，而intwo字段是40-60。

4.总字段应计算在各个类别的inone和twowo模型中输入的内容的总和。请注意，从ng repeat生成总字段，因此我们不能直接计算总数。

Answer 1

沿线有什么......

<td ng-if="x.class=='Personnal'"><input type="tel" ng-maxlength="5"  ng-model="x.inone" ng-change="x.total=x.inone+x.intwo"></td>
<td ng-if="x.class=='Social'"><input type="tel" ng-maxlength="5" ng-model="x.inone"></td>
<td ng-if="x.class=='Personnal'"><input type="tel" ng-minlength="11" ng-maxlength="15" ng-model="x.intwo" ng-change="x.total=x.inone+x.intwo"></td>
<td ng-if="x.class=='Social'"><input type="tel" ng-minlength="16" ng-maxlength="20"  ng-model="intwo"></td>

Tu总结一下：

ng-value没用，将数据直接绑定到x。[value]
使用ng-if在不同的班级之间切换
使用ng-minlength / ng-maxlength进行验证
每次使用ng-change重新计算总计，您可能希望在总计字段中添加只读/禁用标记。如果total不是字符串连接，请使用将在控制器中调用的函数进行正确的转换并总结。

如何对不同的ng-repeat字段应用不同的验证，并在ng重复自身中自动计算其总数

1 个答案: