Question

我正在使用Angular Js。我有一个名为＆＃34; Include Image＆＃34;的复选框，默认情况下会选中它。我有一个文件上传控件，用户可以使用它上传自定义图像。我试图隐藏并显示基于复选框的文件上传控件。如果取消选中该复选框，我想隐藏文件上传控件。我已尝试过以下代码，但在页面加载时，如果选中该复选框，则不会显示文件上载。如果取消选中并选中该复选框，则文件上载将隐藏并显示。如何在加载中显示文件上载。以下是使用的代码：

<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>

文件上传控件只应显示下拉列表中是否没有值＆＃34; - 选择季节 - ＆＃34;并选中复选框。怎么做到这一点？感谢

Answer 1

尝试在ng-show内的fileUpload控件上包含（req'd）模型属性，以有条件地显示/隐藏

<强> HTML

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

根据Angular Js中的条件隐藏和显示文件上传控件

1 个答案: