1

在我的代码中，我正在使用ng-show并ng-required结合使用。但是，ng-required即使将相应的$scope变量值设置为，也无法按预期工作false。请在下面找到代码

<div role="form" name="selectQuestionsForm" id="selectQuestionsForm" ng-form>
    <div class="form-group col-sm-12">
        <label  class="control-label question-answer-label"
                  for="firstQuestionSelect">First question</label>

        <div>
            <select class="form-control nopadding">
                <option value="">-- Select --</option>
            </select>
        </div>
        <div ng-show="showCustomQuestion.first" >
            <input type="text" class="form-control" ng-model="questionsText.first" ng-required="showCustomQuestion.first"
            id="firstQuestionInput" name="firstQuestionInput" validation-min-length="3" validation-max-length="100" />
        </div>
        <label  class="control-label question-answer-label"
                  for="firstAnswerInput">First answer</label>
        <div style="padding-bottom: 15px;">
            <input type="text" class="form-control" ng-model="answersText.first" 
            id="firstAnswerInput" validation-min-length="3" validation-field-required="true" validation-max-length="100" required/>
        </div>
    </div>
</div>
<div id="securityActionBtnContainer" class="visible-md visible-sm visible-lg">
    <button id="saveBtn" type="button" ng-disabled="selectQuestionsForm.$invalid" class="btn btn-default btn-xs pull-right"  ng-click="saveQuestion(selectQuestionsForm.$valid)">Save</button>
    <button id="cancelBtn" type="button" class="btn btn-xs btn-default pull-right" style="margin-right: 10px;" ng-click="redirect['cancel']()">Cancel</button>
</div>

该select元素具有显示选项的逻辑，并且工作正常。当我们选择“写我自己的问题”选项时，将input显示隐藏。如果用户选择任何其他问题，自定义问题input将被隐藏，而不是表单元素的一部分。但是ng-required，尽管该值设置为false并且各自form未验证，但仍然被应用。

请让我知道我缺少什么以使其正常工作。在此先感谢您的帮助。

4

1 回答 1

1

使用ng-if而不是ng-show. 使用 ngShow 或 ngHide 隐藏的项目仍然存在于 DOM 中，并将由 angular 处理。它只是对用户不可见。

于 2015-09-03T17:27:01.293 回答