숨기기 및 표시 Angular Js의 조건에 따른 파일 업로드 제어

Question

Angular Js를 사용하고 있습니다. 기본적으로 선택되어있는 "이미지 포함"이라는 확인란이 있습니다. 파일 업로드 컨트롤을 사용하여 사용자가 사용자 지정 이미지를 업로드 할 수 있습니다. 확인란을 기반으로 파일 업로드 컨트롤을 숨기고 표시하려고합니다. 확인란을 선택하지 않으면 파일 업로드 컨트롤을 숨기고 싶습니다. 아래 코드를 시도했지만 페이지로드시 확인란을 선택하면 파일 업로드가 표시되지 않습니다. 확인란을 선택 취소하고 선택하면 파일 업로드가 숨기고 표시됩니다. 로드시 파일 업로드를 표시하는 방법. "- 시즌을 선택 -"드롭 다운 값이없는 경우

<div class="row"> 
        <div class="col-sm-2"> 
         <label class="control-label">Seasons:</label><em style="color:red">*</em> 
        </div> 
        <div class="col-sm-4 form-group" > 
         <select name="seasonTypeSelect" required="" ng-model="selectedSeasonsType" class="dropdown form-control cl-sm-6" ng-options="season.SeasonTypeName for season in seasons" ng-change="updateImageUrl(selectedseasonsType)"> 
          <option value="">-- Select the Season --</option> 
         </select> 
        </div> 
        <span style="color:red" ng-show="submitted == true && mainForm.seasonTypeSelect.$error.required">Seasons is required</span> 
       </div> 
<div class="row"> 
        <div class="form-group col-md-8" style="padding-left: 0px !important;"> 
         <label class="control-label col-sm-3"> 
<input type="checkbox" ng-model="includeImage" ng-checked="true" ng-change="isImageInclude(includeImage)"> 
          Include Image 
         </label> 
         <img ng-src="{{testTypeImage_url}}" style="padding-left: 20px !important;height:40px" id="imgHolder" alt="Image will display here." class="imagerowStyle" /> 
         <br /> 
        </div> 
        <div class="form-group col-md-4 col-centered"> 

        <input type="file" class="form-control" id="imageUploadfile" name="Imagefile" accept="image/*" /> 
         <input type="button" name="imageUploadButton" ng-click="uploadFiles()" value="Upload" /> 
        </div> 
       </div> 

파일 업로드 컨트롤은 표시해야하고 체크 박스를 체크 : 아래 사용되는 코드입니다. 이것을 달성하는 방법? 감사

Answer 1

그냥 ng-show 조건부 표시/

HTML을 숨길 내부에 파일 업로드 제어에 (req'd) 모델 속성을 포함하십시오 :

<input type="file" ng-show="selectedSeasonsType && includeImage" />