Question

我需要隐藏并显示选择框更改时的div，这已经在ng-if中。这是代码。请帮帮我。

<div class="col-sm-6">
    <select name="" id="print-type" class="form-control" ng-model="printType">
        <option value="selectOne" selected>Select One</option>
        <option value="selectTwo">Wall Decoration</option>
    </select>
</div>
<div class="col-sm-6" ng-if="printType == 'selectTwo'">
     <select name="" id="wall-decoration" class="form-control" ng-model="wallDecorDropdown">
          <option value="One">Select One</option>
          <option value="two">Framed Print</option>
     </select>
</div>

<div ng-if="wallDecorDropdown == 'two'">Hi</div>

非常感谢。

Answer 1

您正在打破始终使用ng-model

中的对象的黄金法则

问题是ng-if创建了子范围。因此，当您更改子范围ng-model="wallDecorDropdown"内的原语时，它将隐藏在父范围内，因为原语不具有与对象/数组相同的继承方式

更改为：

<div class="col-sm-6" ng-if="printType == 'wallDecor'">
     <select name="" id="wall-decoration" class="form-control" ng-model="myScopeModel.wallDecorDropdown">
          <option value="One">Select One</option>
          <option value="two">Framed Print</option>
     </select>
</div>

<div ng-if="myScopeModel.wallDecorDropdown == 'two'">Hi</div>

在控制器中创建一个将由所有子范围继承的对象

$scope.myScopeModel ={}

This 3 minute Egghead video非常值得关注，以便更好地理解。

如何让ng-model在ng-if中工作？

1 个答案: