无法使用NG-如果与NG-重复 [英] Unable to use ng-if with ng-repeat
问题描述
我试图用NG-如果里面NG-重复,但它似乎NG-如果不能正常工作。
I was tried to use ng-if inside ng-repeat but it seems ng-if is not working properly.
我提到夫妇在计算器论坛的链接,但它并不能帮助我。
I referred couple of forum links in StackOverflow but it doesn't help me.
我采用了棱角分明的版本1.3.0
I'm using angular version 1.3.0
HTML
<!DOCTYPE html>
<html ng-app="myModule">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">
<script src="/js/lib/angular-1.3.0/angular.js"></script>
<script src="/js/lib/controllers/ifRepeatController.js"></script>
</head>
<body>
<div ng-repeat = "data in comments">
<div ng-if="data.type == 'hootsslllll' ">
//differnt template with hoot data
</div>
<div ng-if="data.type == 'story' ">
//differnt template with story data
</div>
<div ng-if="data.type == 'article' ">
//differnt template with article data
</div>
</div>
</body>
</html>
控制器
var myIfRepeat = angular.module('myIfRepeat',[]);
myIfRepeat.controller('IfRepeatController', function ($scope,$http) {
$scope.comments = [
{"_id":"1",
"post_id":"1",
"user_id":"UserId1",
"type":"hoot"},
{"_id":"2",
"post_id":"2",
"user_id":"UserId2",
"type":"story"},
{"_id":"3",
"post_id":"3",
"user_id":"UserId3",
"type":"article"}
];
});
根据第一个条件,第一个行应该不会被显示出来(下面找到更多的参考截图),不过是越来越显示就行了。
As per the first condition, the first line should not get displayed (Below find the screenshot for more reference), however the line is getting displayed.
参考链接:采用NG-IF内NG-重复
现在我加入为劝DIV控制器,但我面临同样的问题。
Now i added the controller in the div as advised, however i'm facing the same issue
下面我给出了引用的屏幕截图。请帮助我如何解决这个问题,请让我知道在进一步澄清的情况下。
Below i have given the screenshot for reference. Kindly help me how to solve this issue and please let me know in case of further clarifications.
下面的工作模式提供的截图中使用的角1.3版本。如果我们用角1.0.2的NF-IF将无法正常工作(以下提供的截图)
屏幕快照角版本1.0.2
推荐答案
我不是有这个工作的问题。调整你的code,以适应一个小提琴
I'm not having issues with this working. Tweaked your code to fit into a fiddle
<div ng-app ng-controller="IfRepeatController">
<div ng-repeat="data in comments">
<div ng-if="data.type == 'hootsslllll' ">type={{data.type}}//differnt template with hoot data</div>
<div ng-if="data.type == 'story' ">type={{data.type}}//differnt template with story data</div>
<div ng-if="data.type == 'article' ">type={{data.type}}//differnt template with article data</div>
</div>
</div>
function IfRepeatController($scope) {
$scope.comments = [{
"_id": "1",
"post_id": "1",
"user_id": "UserId1",
"type": "hoot"
}, {
"_id": "2",
"post_id": "2",
"user_id": "UserId2",
"type": "story"
}, {
"_id": "3",
"post_id": "3",
"user_id": "UserId3",
"type": "article"
}];
}
注意:参考角度1.3.0此处的 https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.7/angular.min.js
Note: reference angular 1.3.0 here: https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.7/angular.min.js
这篇关于无法使用NG-如果与NG-重复的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!