AngularJS - 根据单选按钮值有条件地应用必需属性

时间:2014-07-14 10:44:13

标签: angularjs angularjs-directive angularjs-scope

我在我的表单中有以下内容以便验证,当用户点击公民单选按钮时,应该发生什么?根据是/否显示/隐藏'sno'。但是,当用户单击“否”时,我需要删除'sno'的'required'属性,以防止验证'sno'。

<input type="radio" ng-model="citizen" value="Yes" citizen-check>Yes
<input type="radio" ng-model="citizen" value="No">No

<div ng-show='enableNo()'>
    <div id="view">
        <input type="text" id="sno" name="sno" required>
    </div>
</div>
<div ng-hide='enableNo()'>
    <div id="view">
        <input type="text" id="pno" name="pno" required>
    </div>
</div>

内部控制器我有以下显示/隐藏功能,

$scope.enableNo= function()
    {
        $log.log('enableNo called');
        if($scope.citizen == 'Yes')
        {
            return true;
        }
        else
        {
            return false;
        }   
    }

如何编写指令以删除'sno'的'required'属性?

1 个答案:

答案 0 :(得分:37)

使用ngRequired

当ngRequired表达式求值为true时,

ngRequired会向元素添加required属性和required验证约束。

<!-- adds 'required' attribute when ngRequired expression evaluates to true -->
<input type="text" id="sno" name="sno" ng-required="citizen == 'Yes'">