动态单选按钮所需的属性(ng-repeat)

时间:2013-10-04 17:16:54

标签: javascript html5 angularjs

当使用HTML5'required'属性进行无线电类型输入和Angularjs表单验证时,我得到了奇怪的结果

我的意见:

<form name="myForm">
    <div ng-repeat="i in [0,1,2]">
        <input type='radio' name='var1' ng-model='var1' value='1' required />1<br />
        <input type='radio' name='var1' ng-model='var1' value='2' required />2<br />
        <input type='radio' name='var1' ng-model='var1' value='3' required />3<br />
        <span ng-show="myForm.var1.$error.required" ng-click="">Choose an option.</span>
        <button ng-disable="myForm.$invalid">Submit</button>
    </div>
</form>

当我选择一个选项时,其他选项将被取消选中。此外,两者都激活/停用表单验证。

1 个答案:

答案 0 :(得分:1)

是的,这是因为&#34;名称&#34;属性正在重复,请尝试这样:

<form name="myForm">
    <div ng-repeat="i in [0,1,2]">
        <input type='radio' ng-model='i.var1' value='1' required />1<br />
        <input type='radio' ng-model='i.var1' value='2' required />2<br />
        <input type='radio' ng-model='i.var1' value='3' required />3<br />
        <span ng-show="i.var1==''" ng-click="">Choose an option.</span>
        <button ng-disable="i.var1==''">Submit</button>
    </div>
</form>

删除名称并直接使用i.var1 ==&#39;&#39;

执行表单验证/停用