Angularjs:当名称以!开头时,搜索过滤器不起作用(感叹号) [英] Angularjs: Search filter not working when name starting with ! (exclamation mark)

查看:77
本文介绍了Angularjs:当名称以!开头时,搜索过滤器不起作用(感叹号)的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有状态列表,并且在状态名称上添加了搜索过滤器. 我有这样的数组:

I have list of states and I have added search filter on name of states. I have array like this:

stateList : [{name: 'abc', area:500},{name: '!def', area:500}]

我有<li>ng-repeat="state in stateList | filter:{name:searchText}"

使用ng-model="searchText"

搜索在正常情况下有效,但是当我搜索!(感叹号)时.它没有给出任何结果.它应该给出名称为!def"的状态

Search is working in normal scenario but when I search !(exclamation mark). It is not giving any result. It should give state with name '!def'

推荐答案

问题是AngularJS将!令牌识别为否定谓词" .不过,您可以像这样创建自定义myFilter:

The problem is that ! token is recognized by AngularJS as "negative predicate". Nevertheless you can create your custom myFilter like this:

angular.module('app', []).controller('ctrl', function($scope) {
  $scope.stateList = [{
    name: 'abc',
    area: 500
  }, {
    name: '!def',
    area: 500
  }]
}).filter('myFilter', function() {
  return function(input, filter) {
    if (!filter.name)
      return input;
    return input.filter(function(x) {
      return x.name.indexOf(filter.name) != -1;
    });
  }
})

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div ng-app='app' ng-controller='ctrl'>
  <input type='text' ng-model='searchText' />
  <ul>
    <li ng-repeat='state in stateList | myFilter : {name:searchText}'>{{state | json}}</li>
  </ul>
</div>

这篇关于Angularjs:当名称以!开头时,搜索过滤器不起作用(感叹号)的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆