0
votes

ng-if est toujours évalué à vrai à l'intérieur de ng-repeat

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


1 commentaires

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


3 Réponses :


0
votes

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}]
});


0 commentaires

0
votes

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


0 commentaires

0
votes

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 
  }] };

});


0 commentaires