Angularjs中使用过滤器的子字符串

Substring in Angularjs using filters?

本文关键字：字符串 过滤器 Angularjs      更新时间：2024-04-02

我有下面的数组，我想在DOM中使用Angularjs和一些过滤器来操作它

$scope.urls = [{
    path: 'http://a.com/index'        
    }, {
     path: 'http://a.com/home'        
    }, {
    path: 'http://a.com/etc'        
    }, {
    path: 'http://a.com/all'        
   }];

我曾尝试使用过滤器对路径进行子字符串处理，但它不起作用。

Fiddle演示

任何帮助都很好。

试试这个：

HTML

<div ng-controller = "fessCntrl"> 
  <h1>Only path without domain name:</h1>
        <ul>
            <li ng-repeat="url in urls | myCustomFilter">{{url.path}}</li>
        </ul>
</div>

JS

var fessmodule = angular.module('myModule', []);
fessmodule.controller('fessCntrl', function ($scope) {
     $scope.urls = [{
        path: 'http://a.com/index'        
    }, {
         path: 'http://a.com/home'        
    }, {
        path: 'http://a.com/etc'        
    }, {
        path: 'http://a.com/all'        
    }];
    $scope.otherCondition = true;
});
fessmodule.$inject = ['$scope'];
 fessmodule.filter('myCustomFilter', function() {
   return function( urls) {
    var filtered = [];
    angular.forEach(urls, function(url) {
        filtered.push( {path:url.path.substring("http://a.com".length, url.path.length)});
    });
    return filtered;
  };
});

演示Fiddle

附带说明：

尝试从控制器中写入筛选器。

AngularJS v 1.4.5支持一个标准的"limitTo"过滤器，用于具有参数长度和偏移量的数组（包括字符串）：

<div ng-controller = "SampleController"> 
  <h1>Result of substring equivalent filter:</h1>
        <ul>
            <li ng-repeat="url in urls">{{url.path | limitTo:5:12}}</li>
        </ul>
</div>

注意：此解决方案在动态域长度（"http://a.com"静态长度为12）。

注意2：将长度增加到路径的最大结果长度（Max是长度为5的"索引"）。

AngularJS开箱即用支持的所有过滤器概述。

相关文章：