ng-showでのrequiredの使用方法は？

Question

私はその選択肢に基づいて、テキストボックスのラベルを表示する必要があるいくつかの値で選択ボックスを持っています。

例：あなたは

を選択した場合SEは、私がラベルボックスにLOCATION2とレポートを表示する必要があるということです。

あなたは管理手段を選択している場合のみだけLOCATION2ラベルテキスト

ボックスを表示する必要があります。また、ADM /クラスタを選択している場合は、この手段のどれでも場所だけを表示する必要があります。

私は必要があるので、私は保存することができますされていない以外はすべてのために必要なオプションを与えているJSファイル

$scope.ChangeRole = function(id){ 
    roleid=$scope.Role; 
    if(id=="2"){ 
     // alert(id); 
     $scope.showreport =true; 
     $scope.showreportlocation=true; 
     $scope.showlocation = false; 

    }else if(id=="3"){ 
     $scope.showreportlocation = true; 
     $scope.showreport = false; 
     $scope.showlocation = false; 
    }else{ 
     $scope.showreport = false; 
     $scope.showreportlocation = false; 
     $scope.showlocation = true; 
    } 
} 

HTMLファイルここ

<div class="col-lg-6"> 
    <div class="form-group"> 
     <label>Role<span style="color:red">*</span></label> 
      <div class="input-group role"> 
      <select placeholder="Role" ng-model="Role" class="form-control pull-right" ng-change="ChangeRole(Role);" required ng-init="selectedType()" id="selectType"" name="role" required> 
       <option value="0">Role</option> 
       <option value="1">ADM</option> 
       <option value="2">SE</option> 
       <option value="3">MANA</option> 
       <option value="4">ClUSTER</option> 
      </select> 
      <div class="input-group-addon"> 
     </div> 
     </div> 
    </div> 
</div> 

<div class="col-lg-6"> 
    <div class="form-group" ng-show="showlocation"> 
     <label>Location<span style="color:red">*</span></label> 
     <div class="input-group location"> 
     <select id="LocationInput" class="form-control" ng-model="LocationId" ng-options="location.Id as location.NameoftheLocation for location in locations" required> 
      <option id="OptionInput" value="">Location</option> 
     </select> 
     <div class="input-group-addon"> 
     </div> 
    </div> 
    </div> 
</div> 

<div class="col-md-6" ng-show="showreportlocation"> 
    <div class="form-group"> 
    <label>Location2<span style="color:red">*</span></label> 
    <div class="input-group site"> 
     <select data-placeholder="Location" style="width: 100%;" ui-select2="select2Options" class="form-group" multiple ng-model="selectedTags" required> 
     <option ng-repeat="tag in tags" value="{{tag.Id}}">{{tag.NameoftheLocation}}</option> 
     </select> 
     <div class="input-group-addon"> 
     <i class="fa fa-map"></i> 
     </div> 
    </div> 
    </div> 
</div> 
<div class="col-lg-6" id="otherType" ng-show="showreport"> 
    <div class="form-group"> 
     <label>Reporting To<span style="color:red">*</span></label> 
     <div class="input-group"> 
     <select class="form-control" id="reportingto" name="reportingto" ng-options="n.Id as n.Name for n in names" ng-model="ReportingTo" required> 
     <option value="">Reporting To</option> 
     </select> 
     <div class="input-group-addon"> 
     </div> 
    </div> 
    </div> 
</div> 

。

特定の選択のためにng-showを使用しますが、保存中にhtmlもそのフィールドをチェックします。間違っています。

は、いくつかは

Answer 1

使用ng-requiredではなく、唯一それを必要とすることが示されたときに、バイオリンを作り、私に知らせてください。

私はまた、ng-showの代わりにng-ifを使用するというCaseyの提案をテストしました。 https://plnkr.co/edit/eeKvz5zRFeuLSF6fDbuy?p=preview