隱藏並顯示基於Angular Js條件的文件上傳控制

我正在使用Angular Js。我有一個名爲「包含圖像」的複選框，默認情況下會將其選中。我有一個文件上傳控制，使用哪些用戶可以上傳自定義圖像。我試圖隱藏並顯示基於複選框的文件上傳控件。如果複選框未選中，我想隱藏文件上傳控件。我已經嘗試了下面的代碼，但在頁面加載時，當複選框被選中時，文件上傳不顯示。如果我取消選中並選中該複選框，則文件上傳將隱藏並顯示。如何使文件上載在加載中可見。下面是使用的代碼：如果下拉菜單沒有價值隱藏並顯示基於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>

文件上傳控件應該只顯示「 - 選擇季節 - 」和複選框被選中。如何實現這一目標？感謝

來源

2017-01-16 venkat14

你可以試試這個''。如果兩者都是true/valid-js-value，你可以看到fileUpload控件。 –

嗨@supercool ..你能否請改變評論回答。您提供的解決方案解決了問題。 – venkat14

只要嘗試，包括在你的FileUpload控件（職位月薪）模特屬性裏面ng-show有條件地顯示/隱藏

HTML：

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

來源

2017-01-16 09:48:24

隱藏並顯示基於Angular Js條件的文件上傳控制

回答

相關問題