ng-repeat内的AngularJS ng-if不起作用

Question

这是我的代码：

<body  ng-controller="QueryCntl">

<div>
    <h1> Target:{{target}}</h1>         
</div>

<div ng-app="myApp" ng-controller="mytableCtrl">    

<div ng-include="'header.html'"></div>

<div id="menuList">
    <ul class="menuNav">
        <li class="menuList_Slide" ng-repeat="x in names">
            <div>               
                <a href="category.html?categoryid={{x.id}}">{{ x.category }}</a>
            </div>

            <div ng-if="{{target}} == {{x.id}}"> //Display subcategory if true
                <ul id="subCategories">
                    <li>
                        <a href="category.html?subcategoryid={{x.id}}">Childid should be displayed</a>
                    </li>
                </ul>
            </div>
        </li>
    </ul>
</div>

</div>

<script>
    var app = angular.module('myApp', [], function($locationProvider) {
        $locationProvider.html5Mode(true);
    });
    function QueryCntl($scope, $location) {
        $scope.target = $location.search()["categoryid"];       
    }
    app.controller('mytableCtrl', function($scope, $http) {
        $http.get("api/topCategories")
        .success(function(response) {$scope.names = response;});                        
    });

</script>

如果{{target}}等于{{x.id}}，我只想显示1个子类别。 但是现在它可以打印所有内容... {{target}}从URL获得值，其中？categoryid = some_number，而x.id是来自DB的值。 这些值在我的代码中工作正常。

我将不胜感激任何帮助。

编辑：ng-if =“ target == x.id”没有帮助。

Answer 1

ngIf不需要使用{{}} -它已经是Angular表达式：

div ng-if="target == x.id"

Answer 2

问题解决者：我插入了

<base href="category.html">

在head标签中，并删除了错误的脚本源。

Answer 3

您无需在ng-if指令的条件内插入属性，因为Angular已根据范围评估了完整的表达式。 尝试这个：

ng-if="target == x.id"

Answer 4

ngIf指令需要一个表达式，因此您不需要插值标签：

<div ng-if="target == x.id"> //Display subcategory if true
    <ul id="subCategories">
        <li>
            <a href="category.html?subcategoryid={{x.id}}">Childid should be displayed</a>
        </li>
    </ul>
</div>

还有一件事：您没有初始化$scope.target因为相应的控制器在ng-app 。 删除ng-controller="QueryCntl"并将目标初始化添加到mytabeCtrl ：

app.controller('mytableCtrl', function($scope, $http) {
    $scope.target = $location.search()["categoryid"];
    $http.get("api/topCategories")
    .success(function(response) {$scope.names = response;});                        
});

Answer 5

更换：

<div ng-if="{{target}} == {{x.id}}">

带有：

<div ng-if="target == x.id">

ng-if属性应包含纯JavaScript，而不是那些插值标签（ {{}} ）。

所有ng- Attribute都ng- 。

ng-repeat内的AngularJS ng-if不起作用

问题描述

5 个解决方案

解决方案1
1 已采纳 2015-07-15 13:24:24

解决方案2
1 2015-07-17 11:21:26

解决方案3
0 2015-07-15 13:24:16

解决方案4
0 2015-07-15 13:24:23

解决方案5
0 2015-07-15 13:24:32

ng-repeat内的AngularJS ng-if不起作用

问题描述

5 个解决方案

解决方案1 1 已采纳 2015-07-15 13:24:24

解决方案2 1 2015-07-17 11:21:26

解决方案3 0 2015-07-15 13:24:16

解决方案4 0 2015-07-15 13:24:23

解决方案5 0 2015-07-15 13:24:32

解决方案1
1 已采纳 2015-07-15 13:24:24

解决方案2
1 2015-07-17 11:21:26

解决方案3
0 2015-07-15 13:24:16

解决方案4
0 2015-07-15 13:24:23

解决方案5
0 2015-07-15 13:24:32