javascript - AngularJS 过滤器无法正常工作

Question

我有一个过滤器，我想与 ng-repeat 一起使用

浏览器上没有出现控制台消息，因此我无法看到发生了什么。

请您告诉我正确的方向，我在下面的代码中做错了什么？提前致谢!

型号

module Models {
    "use strict";

    export interface IMember {
        Id: number;
        // ...
    }

    export interface IForumContent extends IMember {
        RowId: string;
        // ...
    }
}

Controller

module Controllers {
    "use strict";

    export class ForumController extends ControllerBase.Controller {
        log: ng.ILogService;
        scope: IForumControllerScope;

        static $inject = ["$scope", "$log"];
        constructor($scope: IForumControllerScope, $log: ng.ILogService) {
            super($scope);
            this.log = $log;
            // ...
        }

        // ...
    }
}

过滤器

module Filters {
    "use strict";

    export var $inject = ["$log", "$filter"];
    export function UniqueFilter($log: ng.ILogService, $filter: ng.IFilterService) {
        $log.log("Test 1");
        console.log("Test 1");

        return function(items: Array<Models.ForumContent>, filterOn: string) {
            $log.log("Test 2");
            console.log("Test 2");

            if ((filterOn || angular.isUndefined(filterOn)) && angular.isArray(items)) {
                var newItems = [];

                var extractValueToCompare = function(item) {
                    if (angular.isObject(item) && (angular.isString(filterOn))) {
                        return item[filterOn];
                    } else {
                        return item;
                    }
                };

                angular.forEach(items, function(item) {
                    var valueToCheck, isDuplicate = false;

                    for (var i = 0; i < newItems.length; i++) {
                        if (angular.equals(extractValueToCompare(newItems[i]), extractValueToCompare(item))) {
                            isDuplicate = true;
                            break;
                        }
                    }

                    if (!isDuplicate) {
                        newItems.push(item);
                    }

                });
                items = newItems;
            }
            return items;
        }
    }
}

全局

var applicationModule = angular.module("app", []);
applicationModule.filter('uniqueFilter', Filters.UniqueFilter);
applicationModule.controller("forumController", Controllers.ForumController);

HTML

<table class="table table-hover">
    <tbody>
        <tr>
            <th>Content</th>
        </tr>
        <tr ng-model="forumContent" ng-repeat="forumContent in forumRepository.Forum.Contents | filter: uniqueFilter:'Id'">
        </tr>
    </tbody>
</table>

Answer 1

试试这个:

<tr ng-model="forumContent" ng-repeat="forumContent in forumRepository.Forum.Contents | uniqueFilter:'Id'"></tr>

Remove filter: part in HTML