Question

我正在处理AngularJS中的一个要求，我需要根据下拉选项更改div。基本上有两个div，一个包含一个下拉列表，另一个包含一个文本框（两个div都具有相同的模型名称city）。现在，另一个下拉列表中的div将是状态。

  <div class="col-xs-6 col-sm-4" ng-if="addressdetail.address.state == 'NewDelhi'">
                    <label for="city">
                        City
                    </label>
                    <select selectpicker="city1List" title="Select" id="City" style="" name="City" ng-model="addressdetail.address.city"
                    class="selectpicker" ng-options="obj.code as obj.desc for obj in city1List">
                        <option value="">
                        </option>
                    </select>

                </div>

                 <div class="col-xs-6 col-sm-4" ng-if="addressdetail.address.state != 'NewDelhi'">
                    <label for="City">                            
                                   City                            
                    </label>

                    <input id="City" style="" name="City" value="" ng-model="addressdetail.address.city" class="form-control"
                    type="text">
                </div>



                <div class="col-xs-6  col-md-4 col-sm-4 ">
                    <label for="state">
                        State
                    </label>
                    <select selectpicker="state1List" title="Select" id="State" style="" name="State" ng-model="addressdetail.address.state"
                    class="selectpicker" ng-options="obj.code as obj.desc for obj in state1List">
                        <option value="">
                        </option>
                    </select>
                </div>

现在一切正常，但我不知道如何在选择状态下拉菜单后将文本框的值更改为空并下拉为空。

Answer 1

在选择状态时调用ng-change中的角度函数，并将所需模型设为空值。

<select selectpicker="state1List" title="Select" id="State" style="" name="State" ng-model="addressdetail.address.state"
                    class="selectpicker" ng-options="obj.code as obj.desc for obj in state1List" 
ng-change="resetCity()">
                        <option value="">
                        </option>
                    </select>

在控制器中写下以下功能。

$scope.resetCity = function (){
    $scope.addressdetail.address.city=YOUR_DFAULT_VALUE;
};

如果状态<select>发生任何变化，则调用函数。

如何在视图中的下拉列表选择中将模型的值设置为空

1 个答案: