JavaScript 选择过滤器

Question

背景:有一个表，我可以从中选择员工。我想按姓名过滤这些员工。(我知道姓名不是一个好的过滤方式，这只是一个例子) 基本上我有一个下拉列表，我可以从中选择一个过滤器。

我的声明:$scope.filters = null;。 我也有这个减速来选择我的过滤器 $scope.chosenFilter= null;。

我使用以下内容来检索我拥有的不同过滤器$scope.filters =retrieveFilters(info.Names);

retrieveFilters 如下所示:

var retrieveFilters = function(rows) {

    var filterWrapper = document.querySelector(".filterWrapper");
    var datasetOptions = [];

    $scope.predicate = 'Name';

    if (rows) {
        //Add Default option
        datasetOptions.push({
            name: $scope.data.Fnames.defaultFilterOptionLabel,
            value: ''
        });
        $scope.chosenFilter = datasetOptions[0];

        _.forEach(rows, function(ele) {
            datasetOptions.push({
                name: ele,
                value: ele
            });
        });
    } else {
        filterWrapper.style.display = "none";
            }

    return datasetOptions;
};

我使用以下内容来选择我的过滤器:

$scope.$watch('chosenFilter', function() {
    var filterSearchInput = document.querySelector(".filterWrapper input");
    ng.element(filterSearchInput).triggerHandler('input');
});

一切都很好，第一次加载时显示正常，因为我已经使用

设置了默认值

//Add Default option
datasetOptions.push({
    name: $scope.data.Fnames.defaultFilterOptionLabel,
    value: ''
});

从默认表中，每当我单击员工姓名时，都会显示详细信息。但是，每当我过滤并单击员工姓名时，都不会显示任何内容。每当我单击默认表中的特定员工姓名，然后以相同的姓名进行过滤时，信息也会显示出来，因为我每次都会缓存它。

Answer 1

我假设您使用 ng-repeat 在 GUI 中的某个位置显示此数据。 Angular 为此提供了许多很棒的内置功能。在这里查看答案:AngularJS custom search data by writing custom filter寻找一种从 Angular 方向更接近这个问题的方法。您可能还想查看此问题和答案:"Thinking in AngularJS" if I have a jQuery background? .