ng-if总是在ng-repeat内被评估为真
[英]ng-if is always evaluated to true inside ng-repeat
问题描述
I'm looping on an array of objects and I want to display some stuff depending on the value of a field for each item in the array. 
我正在循环一个对象数组，我想显示一些东西，具体取决于数组中每个项目的字段值。 For this, I have a ng-repeat iterating through my array, and an ng-if evaluating if my current item value is appropriated. 为此，我有一个ng-repeat迭代遍历我的数组，并且ng-if评估我当前的项目值是否合适。
For some reason the ng-if seems to always be evaluated to true (or not evaluated at all?) 由于某种原因，ng-if似乎总是被评估为真（或根本没有评估？）
edit.html edit.html
<div data-ng-app='myApp' data-ng-controller='myCtrl'>
<div>
<div ng-repeat="legalRemedy in legalRemedies">
<div ng-if="legalRemedy.erased === false">
Only valid stuff here
</div>
</div>
</div>
</div>
controller.js controller.js
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
$scope.bulletin.legalRemedies = [{
"erased": true // invalid stuff
}];
});
Here's the jsfiddle (no data should be displayed as the erased property is true) https://jsfiddle.net/vtcLpzmx/2/ 这是jsfiddle（擦除属性为true时不显示数据） https://jsfiddle.net/vtcLpzmx/2/
It's probably pretty dumb but I cannot find why and it's killing me 这可能是相当愚蠢但我找不到原因，它杀了我
3 个解决方案
解决方案1
0 已采纳 2019-05-16 10:30:22
Your code is working fine. 你的代码工作正常。 just in your jsfiddle I think you have missed to add angular script. 只是在你的jsfiddle我认为你错过了添加角度脚本。 so that it doesn't consider that fiddle as angular application. 所以它不认为那个小提琴是有角度的应用。
var app = angular.module('myApp', []); app.controller('myCtrl', function($scope) { $scope.bulletin = {}; $scope.bulletin.legalRemedies = [{"erased" : true}] });
<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>
解决方案2
0 2019-05-16 10:34:15
$scope.bulletin.legalRemedies is causing error because $scope.bulletin is undefined. $ scope.bulletin.legalRemedies导致错误，因为$ scope.bulletin未定义。 first you need to declare $scope.bulletin to an object. 首先，您需要将$ scope.bulletin声明为对象。
<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>
解决方案3
0 2019-05-16 10:35:38
try below solution. 尝试以下解决方案 changed $scope.bulletin variable. 更改了$scope.bulletin变量。
var app = angular.module('myApp', []); app.controller('myCtrl', function($scope) { $scope.bulletin = { legalRemedies : [{ "erased": true // invalid stuff },{ "erased": false }] }; });
<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>
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.