Bootstrap - 在下拉選擇更改，使文本控制強制

Question

我有我的形式選擇控件和文本控件。當選擇發生變化時（用戶選擇特定值時），我希望文本控件成爲強制性的。表單打開時，該文本控件不應該是強制性的。這可能嗎？

我使用引導程序3和AngularJS。對於兩者來說都是一個新手。

這裏是我的代碼：

<div class="form-group"> 
    <label class="col-sm-2 control-label">Select an Option</label> 
    <div class="col-sm-4"> 
     <select class="form-control" name="type"> 
      <option value="A">Option A</option> 
      <option value="B">Option B</option> 
     </select> 
    </div> 
    <div class="col-sm-4"> 
     <input type="text" class="form-control" name="text" id="text" ng-model="text" > 
     <span class="help-block" style="color:red" ng-show="myform.text.$dirty && myform.text.$invalid"> 
      <span ng-show="myform.text.$error.required">Required, when Option B is selected</span> 
     </span> 
    </div> 
</div> 

默認「選項A」將被選中，當用戶選擇「選項B」，我想是強制性我的文字控制。當窗體打開

任何幫助深表感謝

Answer 1

我會用NG-改變你的選擇框中設置將觸發值的$ scope屬性這會不會是強制性的NG-需要你文本域。

的選擇框：

<select class="form-control" name="type" ng-model="optionValue" ng-change="setRequired()"> 
       <option value="A">Option A</option> 
       <option value="B">Option B</option> 
      </select> 

的文本字段：

<input type="text" class="form-control" name="text" id="text" ng-model="text" ng-required="textRequired" /> 

控制器：

function mainController($scope) { 
     $scope.optionValue = 'A'; 
     $scope.textRequired = false; 
     $scope.setRequired = function() { 
      if($scope.optionValue==='B') { 
       $scope.textRequired= true; 
      } 
      else { 
       $scope.textRequired = false; 
      } 
     } 
    } 

http://plnkr.co/edit/lyMgKIEJukpgnA31hnTz?p=preview