角度フォーム検証：どのように$無効

Question

<div class="col-xs-7"> 
    <div class="checkbox"> 
     <label> 
     <input type="checkbox" ng-model="settings.input"> 
     checked 
     </label> 
    </div> 
    <div collapse="!settings.input" ng-class="myform.input.$invalid ? 'has-error has-feedback': ''"> 
     <input type="number" class="form-control input-sm" id="inputEmail3" name="input" ng-model="settings.input" placeholder="if checked, then do validation" required min="0"> 
     <span ng-show="myform.input.$invalid" class="glyphicon glyphicon-remove form-control-feedback" aria-hidden="true"></span> 
    </div> 
    </div> 

demo here

を上書きするために私の質問は、私はinputためrequiredを設定すると、form.$validが偽になりますです、しかし、私がしたいことだけですcheckboxがにチェックされている場合は、inputの検証を行います。チェックされていない場合、inputの値も空白の場合、の値オーバーライドする方法を、inputの$validをオーバーライドすることである私の目的真

すべきですか？

Answer 1

角度は、式で必要な属性を有効にすることができますng-requiredディレクティブを持っています。以下でinputにrequired=""を交換してください：

あなたの両方のようなものだ

ng-required="settings.checked" 

Live example

Answer 2

フォーム入力フィールドが必須であると考えられるため、フォーム入力フィールドが無効になっています。ですから、で入力時にng-requiredディレクティブを持つことで、フォームフィールドにrequired属性を条件付きで追加する必要があります。

マークアップ

<div collapse="!settings.input" ng-class="myform.input.$invalid ? 'has-error has-feedback': ''"> 
    <input type="number" class="form-control input-sm" id="inputEmail3" name="input" 
    ng-model="settings.input" placeholder="if checked, then do validation" 
    ng-required="settings.input" min="0"/> 
    <span ng-show="myform.input.$invalid" class="glyphicon glyphicon-remove form-control-feedback" 
    aria-hidden="true"></span> 
</div> 

Forked Plunkr