Question

我是AngularJS的新手并尝试在angularJs中进行隐藏显示。

以下是我的代码：

  <ul class="recent-rate-list">
      <li ng-repeat="ratedType in ratedTypes">
          <a href="#" style="line-height:30px">{{ratedType.type}}</a>
      </li>
  </ul>

AngularJS：

        $scope.ratedTypes = [
        {
            type: 'Select All',
            "value": '0',
            isSelected : true
        }, {
            type: 'Option 1',
            "value": '1',
            isSelected: false
        }, {
            type: 'Option 2',
            "value": '2',
            isSelected: false
        },{
            type: 'Option 3',
            "value": '3',
            isSelected: false
        },
    ];

当isSelected = true时我需要的地方

      <a href="#" style="line-height:30px"><span>{{ratedType.type}}</span></a>

当isSelected = false时

      <a href="#" style="line-height:30px">{{ratedType.type}}</a>

我知道angularJs有ng-if，但我无法使用它。如何使用ng-if？

解决它

感谢。

Answer 1

您可以将ng-if条件放在div标签内。

＆＃13;

<div ng-if="isSelected === true"><a href="#" style="line-height:30px"><span>{{ratedType.type}}</span></a></div>

 <div ng-if="isSelected === false"><a href="#" style="line-height:30px">{{ratedType.type}}</a><div>

＆＃13;

Answer 2

你可以这样添加 -

<div ng-if="isSelected"><a href="#" style="line-height:30px"><span>{{ratedType.type}}</span></a></div>

 <div ng-if="!isSelected"><a href="#" style="line-height:30px">{{ratedType.type}}</a><div>

并在您的控制器中定义 -

$scope.isSelected = false;

希望这会有所帮助：）

angularJs中的ng-if条件

2 个答案: