将控制器方法定义为自定义过滤器在 AngularJs 中不起作用答案

【问题标题】：Defining a controller method as a custom filter does not work in AngularJs将控制器方法定义为自定义过滤器在 AngularJs 中不起作用
【发布时间】：2015-01-07 18:37:12
【问题描述】：

我正在尝试使用与 Ionic 捆绑的 AngularJs 中的控制器方法来实现自定义过滤器。

<div class="list">
    <a class="item item-icon-right" data-ng-repeat="d in filtered_documents = (data.documents | filter:filterDocuments )">
        {{ d.name }}
        <i class="icon ion-chevron-right icon-accessory"></i>
    </a>
</div>

在我的控制器中，我有：

$scope.filterDocuments = function(doc) {
    return true;
}
$scope.data.documents = [{name: "doc1"}, {name: "doc2"}];

我确定我的设置，因为我可以在 filterDocuments 方法中设置一个断点并查看它运行。但是列表始终是空的，并且从未列出任何内容！

我正在使用捆绑在 Ionic v1.0.0-beta.14 中的 AngularJS v1.3.6。

【问题讨论】：

标签： angularjs filter ionic

【解决方案1】：

您必须为您的模块注册过滤器功能，如下所示：

angular.module('yourModule', []).filter('filterDocuments', function() {
    return function(doc) {
        return true;
    };
});

【讨论】：

这是定义filter 的正确方法。但我对以下解决方案更感兴趣：stackoverflow.com/questions/18792039/…

【解决方案2】：

您不能使用 $scope 方法或控制器方法作为过滤器，您需要使用自定义角度过滤器，并使用这样的 sintax 定义它（类似于控制器 sintax，但作为过滤器）

yourApp.filter('filterDocuments', function(){
    return function(array) {
         //your logic for the array here
         return filtered_array //return the array modified by your code
    }
})

在你的模板 html 中

<div class="list">
    <a class="item item-icon-right" data-ng-repeat="d in data.documents | filterDocuments">
        {{ d.name }}
        <i class="icon ion-chevron-right icon-accessory"></i>
    </a>
</div>

【讨论】：