Voici mon code:

<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>

Je souhaite afficher uniquement 1 sous-catégorie si {{target}} est égal à {{x.id}}. Mais pour l'instant, il imprime tout ... {{target}} obtient la valeur de l'url où? Categoryid = some_number et x.id est une valeur de DB. Ces valeurs fonctionnent bien dans mon code.

J'apprécierais toute aide.

MODIFIER: ng-if = "target == x.id" n'aide pas.

0
Laurynas 15 juil. 2015 à 16:21

5 réponses

Meilleure réponse

ngIf n'a pas besoin d'utiliser {{}} - c'est déjà une expression angulaire:

div ng-if="target == x.id"
1
tymeJV 15 juil. 2015 à 13:53

Remplacer:

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

Avec:

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

L'attribut ng-if doit contenir du code JavaScript simple, au lieu de ces balises d'interpolation ({{}}).

Cela est vrai pour tous les attributs ng-.

0
Cerbrus 15 juil. 2015 à 13:24

La directive ngIf attend une expression, vous n'avez donc pas besoin de balises d'interpolation:

<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>

Et encore une chose: vous n'initialisez pas $scope.target car le contrôleur correspondant est en dehors de ng-app. Supprimez ng-controller="QueryCntl" et ajoutez l'initialisation cible dans mytabeCtrl:

app.controller('mytableCtrl', function($scope, $http) {
    $scope.target = $location.search()["categoryid"];
    $http.get("api/topCategories")
    .success(function(response) {$scope.names = response;});                        
});
0
dfsq 15 juil. 2015 à 13:44

Vous n'avez pas besoin d'interpoler les propriétés dans la condition de la directive ng-if car Angular évalue déjà l'expression complète par rapport à la portée. Essaye ça:

ng-if="target == x.id"
0
sdgluck 15 juil. 2015 à 13:24

Résolution de problèmes: j'ai inséré

<base href="category.html">

Dans les balises head et supprimé la mauvaise source de script.

1
Laurynas 17 juil. 2015 à 11:21