Sous-chaîne dans Angularjs à l'aide de filtres?

Je vais avoir le tableau suivant que je veux manipuler dans les DOM en utilisant Angularjs avec quelques filtres

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

J'avais essayé de substring le chemin à l'aide de filtres, mais il ne fonctionne pas.

Violon Démo

Toute aide est la grande.

  • Voulez-vous pour obtenir la sortie: index, la maison, etc, tous ?
InformationsquelleAutor karthick | 2013-12-05
  1. 1

    Essayez celui-ci:

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

    Démo Violon

    Comme une note de côté:

    Essayer d'écrire des filtres de contrôleur.

    InformationsquelleAutor Maxim Shoustin
  2. 1

    AngularJS v 1.4.5 prend en charge une norme "limitTo" filtre pour les tableaux(y compris la chaîne) avec des paramètres de longueur et de décalage:

    <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>

    Note: Cette solution échoue dans le cas de la dynamique de la longueur de domaine("http://a.com" statique longueur de 12).

    Note 2: Augmentation de la longueur au maximum résultant de la longueur de chemin d'accès(Max est "index", ayant la longueur de 5).

    Aperçu de tous les filtres pris en charge par AngularJS hors de la boîte.

    InformationsquelleAutor David Renner