【问题标题】:Angular ui-select with or conditioned filter带有或条件过滤器的 Angular ui-select
【发布时间】:2016-02-10 02:11:02
【问题描述】:

我正在尝试在 ui 选择中使用或条件过滤器,但我不确定如何处理它。我有一个类似的问题已回答here。但这要求使用 AND 条件,这也适用于我。这是我的代码

HTML

<ui-select ng-model="citySelected">
    <ui-select-match>
        {{$select.selected.name + ', ' + $select.selected.country}}
    </ui-select-match>
    <ui-select-choices repeat="city in List | filter: {name: $select.search} | orderBy:'sortOrder'">
        <span ng-bind-html="city.name + ', ' + city.country| highlight: $select.search"></span>
    </ui-select-choices>
</ui-select>

【问题讨论】:

    标签: angularjs ui-select


    【解决方案1】:

    我正在使用属性过滤器来搜索我指定的任何参数。

        app.filter('propsFilter', function() {
           return function(items, props) {
               var out = [];
    
               if (angular.isArray(items)) {
                   items.forEach(function(item) {
                   var itemMatches = false;
    
                   var keys = Object.keys(props);
                   for (var i = 0; i < keys.length; i++) {
                       var prop = keys[i];
                       var text = props[prop].toLowerCase();
                       if (item[prop].toString().toLowerCase().indexOf(text) !== -1){
                           itemMatches = true;
                           break;
                       }
                    }
    
                    if (itemMatches) {
                      out.push(item);
                    }
                 });
               } else {
               // Let the output be the input untouched
                   out = items;
               }
    
               return out;
             }
        });
    
     //To use add this to UI-Selet Where you are using filter
     <ui-select-choices repeat="city in List | propsFilter: {name: $select.search, secondFilter: $select.search, third: $select.search} | orderBy:'sortOrder'">
    

    【讨论】:

    • 我写了一个类似的自定义过滤器。但是突然之间它停止了工作。过滤器甚至没有被调用。我唯一改变的是我将它部署到不同的服务器上。你遇到过这样的问题吗?
    猜你喜欢
    • 1970-01-01
    • 2015-09-27
    • 2017-12-03
    • 2021-08-08
    • 2015-01-22
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多