Angular JS 'Startswith' custom filter

2019-01-18 21:20发布

问题:

So I've been trying a while to make a custom filter that searches for the 'Startswith' parameters rather than the 'Contains'. Every filter that I've written haven't seem to work properly. Here is an example of what I'm trying to achieve ---> 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 - Here is where I'm at right now.

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

<li>{{msg.last_name}}</li>

Any help would be greatly appreciated!

回答1:

A simple way to do this is to add a new method to your scope.

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

Then change the filter syntax on your element.

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

Here is a working plunkr with the example above.



回答2:

Filter in object

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


回答3:

Now pure javascript itself has the startsWith() method on strings. But it will not be supported by IE11.

See here:

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