1

I am having the following array that i want to manipulate in DOM using Angularjs with some filters

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

I had tried to substring the path using filters but it is not working.

Fiddle Demo

Any help is great.

1
  • Do you want to get output: index, home, etc, all ? Commented Dec 5, 2013 at 7:51

2 Answers 2

2

Try this one:

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

As a side note:

Try to write filters out of controller.

Sign up to request clarification or add additional context in comments.

Comments

2

AngularJS v 1.4.5 supports a standard "limitTo" filter for arrays(including string) with parameters length and offset:

<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: This solution fails in case of dynamic domain length("http://a.com" static length of 12).

Note 2: Increase length to the maximum resulting length of path(Max is "index" having length of 5).

Overview of all filters supported by AngularJS out of the box.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.