AngularJs : ng-if重复，重复比在ng-if中重复的多。

Question

我需要一个由其定义的属性(监视)过滤的数据列表，我不能这样做：

ng-if="project.monitored"

因为我需要清点那些没有监控的。

例如，我简化了从getProjects()返回的数据，这通常是：

this.projects = {
    "owned": [
        {
            "name": "project-1",
            "monitored": true
        },
        {
            "name": "project-2",
            "monitored": true
        }
    ],
    "John Doe": [
        {
            "name": "project-3",
            "monitored": true
        },
        {
            "name": "project-4",
            "monitored": false
        }
    ]
};

我将在模板中先遍历this.projects.owner，然后再遍历其余部分。此处未受监测的总数为1。

所以我想我不能使用这样的solution

示例:

模板

<div ng-init="getProjects()">
    <div ng-if="vm.isMonitored(project.name)" ng-repeat="project in vm.projects">{{ project.name }}</div>  
</div>

主计长：

getProjects(){

    console.log('init');

    this.projects = {
        {
            "name": "project-1",
            "monitored": true
        },
        {
            "name": "project-2",
            "monitored": true
        }
    };

}

isMonitored(name) {

    console.log('Name :'+name);

    return true;

}

模板正确地显示了两个结果：

项目-1项目-2

但是console.log：

init
dashboard.controller.js?e45c:217 Name :project-1
dashboard.controller.js?e45c:217 Name :project-2
dashboard.controller.js?e45c:217 Name :project-1
dashboard.controller.js?e45c:217 Name :project-2
dashboard.controller.js?e45c:217 Name :project-1
dashboard.controller.js?e45c:217 Name :project-2

因此，我不明白为什么在模板上显示的结果是正确的时候，我有那么多来自console.log的副本。

因此，如果我用ng-if来计数，结果将是错误的。为什么？有什么解决办法吗？

Answer 1

在每个摘要周期，AngularJS将重新评估注册的观察者(因此您的vm.isMonitored(project.name))。这就是为什么您的控制台多次显示日志。

使用ng-if时，所使用的值必须是布尔值，或者返回布尔值的方法。由于AngularJS的机制，您不能在这种方法中进行业务工作。为了表现得好，你的观点应该是：

​

<div ng-if="project.monitored" ng-repeat="project in vm.projects">{{ project.name }}</div>

​

或者更好的是，您可以在控制器中筛选您的集合以优化ng-repeat工作。