Angular JS 'Startswith' 自定义过滤器

Posted 2023-02-27

【中文标题】Angular JS \'Startswith\' 自定义过滤器

【英文标题】：Angular JS 'Startswith' custom filterAngular JS 'Startswith' 自定义过滤器

【发布时间】：2013-10-30 08:17:18

【问题描述】：

所以我一直在尝试制作一个自定义过滤器来搜索“Startswith”参数而不是“包含”。我编写的每个过滤器似乎都无法正常工作。这是我正在尝试实现的示例 ---> http://jsfiddle.net/DMSChris/9ptr9/

function FilterCtrl() 
var scope = this;
scope.doFilter = function(elem)  
    if(!scope.searchText) return true;
    return elem.last_name.toLowerCase().indexOf( scope.searchText.toLowerCase()) == 0; 
;

http://jsbin.com/OyubElO/1/edit - 这就是我现在的位置。

  <ul border="1px" ng-repeat="msg in messages | filter:search:strict">

<li>msg.last_name</li>

任何帮助将不胜感激！

【问题讨论】：

如果elem.last_name可以是长字符串，可以考虑截断然后与===比较到文本中查找

【参考方案1】：

一个简单的方法是向你的作用域添加一个新方法。

$scope.startsWith = function (actual, expected) 
    var lowerStr = (actual + "").toLowerCase();
    return lowerStr.indexOf(expected.toLowerCase()) === 0;

然后更改元素上的过滤器语法。

<ul border="1px" ng-repeat="msg in messages | filter:search:startsWith">

这是上面示例的working plunkr。

【讨论】：

@Robin 我在示例中添加了一个 plunkr。什么不适合你？

@mark plunkr 似乎不存在。但这对我有用！

@Shadow 感谢您告诉我！我清理了我的 plunks 并且不小心删除了那个。它现在重新创建了。

@mark 这工作得很好，我只是不明白需要什么预期变量？

谢谢马克，超级解决方案。

【参考方案2】：

在对象中过滤

  $scope.fmyData = $filter('filter')($scope.AllMyData, $scope.filterOptions,function (actual, expected) 
                    return actual.toLowerCase().indexOf(expected.toLowerCase()) == 0;
                );

【讨论】：

嗨@user35..，有没有工作的plunker，好吗？它真的需要我。谢谢。

【参考方案3】：

现在纯javascript 本身在字符串上有startsWith() 方法。但IE11 不支持。

看这里：

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/startsWith