Angular JS custom filter not working

Question

I'm new, meaning this is my first hour with AngularJS. I'm trying to get a hang of writing custom filters, and here is my first one:

http://jsfiddle.net/rutwick/UJTdb/

angular.module('myfilters', []).
filter('addon', function(){
        alert('here');
        return function(ip){
            return ip+'-suffix';
        }
    });
angular.module('myapp', ['myfilters']);

If I try using it like so:

<input type="text" ng-model="sometext" />
<h1>{{ sometext | addon }}</h1>

I get a whole lotta errors. So I use it like this:

<input type="text" ng-model="sometext" />
<h1>{{ sometext | filter:addon }}</h1>

No errors, but it doesn't work. The alert doesn't pop. Am I missing something here?

Errors:

Error: Unknown provider: addonFilterProvider <- addonFilter
at Error (<anonymous>)...blah blah file path

You need to register your filter with your app. Is "angular" your application name? — AlwaysALearner
– AlwaysALearner, Commented Jul 26, 2013 at 14:30
Works like it should for me: plnkr.co/edit/0PkNAMXdPBp6jVnpns5U?p=preview — Marcel Gwerder
– Marcel Gwerder, Commented Jul 26, 2013 at 14:31

mikach · Accepted Answer · 2013-07-26 14:40:20Z

2

See updated variant here http://jsfiddle.net/UJTdb/6/

Basic idea was to set <body ng-app="myapp">

Also I changed a filter function:

filter('addon', function(){
        alert('here');
        return function(ip){
            return ip || '' +'-suffix';
        }
    });

answered Jul 26, 2013 at 14:40

mikach

2,4272 gold badges16 silver badges15 bronze badges

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

Comments

AlwaysALearner · Accepted Answer · 2013-07-26 14:43:45Z

1

<body ng-app="myapp">

does the trick! :D

answered Jul 26, 2013 at 14:43

AlwaysALearner

43.9k9 gold badges98 silver badges78 bronze badges

Collectives™ on Stack Overflow

Angular JS custom filter not working

2 Answers 2

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Related