Je boucle sur un tableau d'objets et je veux afficher des trucs en fonction de la valeur d'un champ pour chaque élément du tableau. Pour cela, j'ai un ng-repeat itérant dans mon tableau, et un ng-if évaluant si la valeur de mon élément actuel est appropriée.
Pour une raison quelconque, le ng-if semble toujours être évalué à vrai (ou non évalué à tout?)
edit.html
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.bulletin.legalRemedies = [{
"erased": true // invalid stuff
}];
});
controller.js
XXX
Voici le jsfiddle (aucune donnée ne doit être affichée car la propriété effacée est vraie) https://jsfiddle.net/vtcLpzmx/2/
C'est probablement assez stupide mais je ne trouve pas pourquoi et ça me tue
3 Réponses :
Votre code fonctionne correctement. juste dans votre jsfiddle, je pense que vous avez manqué d'ajouter un script angulaire. de sorte qu'il ne considère pas ce violon comme une application angulaire.
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js"></script>
<div data-ng-app='myApp' data-ng-controller='myCtrl'>
<div>
<div ng-repeat="legalRemedy in bulletin.legalRemedies">
<div ng-if="!legalRemedy.erased">
Only valid stuff here
</div>
</div>
</div>
</div>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.bulletin = {};
$scope.bulletin.legalRemedies = [{"erased" : true}]
});
$ scope.bulletin.legalRemedies provoque une erreur car $ scope.bulletin n'est pas défini. vous devez d'abord déclarer $ scope.bulletin à un objet.
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<body>
<div data-ng-app='myApp' data-ng-controller='myCtrl'>
<div>
<div ng-repeat="legalRemedy in bulletin.legalRemedies">
<div ng-if="!legalRemedy.erased">
Only valid stuff here
</div>
</div>
</div>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.bulletin = {
legalRemedies : [{
"erased": true // invalid stuff
}
]
}
});
</script>
</body>
</html>
essayez la solution ci-dessous. a changé la variable $ scope.bulletin .
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.7.5/angular.min.js"></script>
<div ng-app='myApp' ng-controller='myCtrl'>
<div>
<div ng-repeat="legalRemedy in bulletin.legalRemedies">
{{$index}} - {{ legalRemedy }}
<div ng-if="!legalRemedy.erased">
Only valid stuff here
</div>
</div>
</div>
</div>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.bulletin = { legalRemedies : [{
"erased": true // invalid stuff
},{
"erased": false
}] };
});
Vos jsFiddle ne sont pas "exécutés" en tant qu'application angulaire, essayez d'ajouter une expression {{1 + 2}} quelque part et observez qu'elle n'est pas affichée sous la forme 3 mais sous la forme {{1 + 2}}