Подстрока в Angularjs с использованием фильтров?

Question

Я имею следующий массив, который я хочу, чтобы манипулировать в 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 Demo

Любая помощь велик.

Answer 1

Попробуйте это:

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; 
    }; 
}); 

Demo Fiddle

В качестве примечания:

попытаться написать фильтры из контроллера.

Answer 2

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: Увеличьте длину до максимальной результирующей длины пути (Макс - это «индекс», имеющий длину 5).

Overview of all filters поддерживается AngularJS из коробки.