ng-如果不起作用 - 角度 1

Question

>位卡住了...我有两个输入/重复单选按钮。

此代码循环遍历对象数据数组并返回饮料名称和价格。 例如，名称："茶"，价格："1.00"。

<div class="field">
 <label class="radio" ng-repeat="drink in grindsIndex.menuDrinks" >
  <input id='drinkRadio' type="radio" ng-model="value" value="{{ 
   drink.price }}" placeholder="{{ drink.name }}" name="name" ng-
   model="grindsIndex.name" ng-change="drinkValue(value)" ng-
   click="clickMethod()"; [checked]="idx === 0" ng-class="{selected: 
   drink.selected === true}"/>
    {{ drink.name }}  &nbsp
    {{ drink.price }}
 </label>
</div> 

当有人点击单选按钮"茶"时，我希望出现这组单选按钮...... 但是NG-IF似乎不起作用。

    <div class="field" ng-if="drink.name == 'tea'">
    <label class="radio" ng-repeat="drink in grindsIndex.menuDrinks" >
    <input type="radio" ng-model="value" value="{{ drink.price }}" placeholder="{{ drink.select }}" name="select" ng-model="grindsIndex.name" ng-change="drinkValue(value)" ng-click="clickMethod()"/>
    {{ drink.select }}  &nbsp
    {{ drink.price }}
    </label>
  </div>

基本上我想说，如果 drink.name==="茶"，请显示这些单选按钮...

有什么想法吗？

Answer 1

这是因为ng-if="drink.name== 'tea'"中的 drink.name 是未定义的，因为它超出了ng-repeat的范围。你可以做的是使用你的第一个输入的ng-model="value"作为

ng-if="value.name == 'tea'"

或者，您可以创建一个新变量，并在第一次输入的 ng 单击或 ng 更改时满足条件时将其设置为 true。

<div class="field" ng-if="displayTea">
</div>

并在控制器中，当满足条件时将此新变量设置为 true

$scope.clickMethod = function(){
    if(someConditionIsMet)
        displayTea = true;
}