AngularJS 中的自定义过滤器

Question

I just made a simple custom filter to strip some chars from a string

angular.module('myApp.filters').filter('myFilter', function() {
return function(string) {
    string = string.replace('[', '');
    string = string.replace(']', '');
    string = string.replace('","', ', ');
    string = string.replace('"', '');

    return string;
}
});

then in the template

<td>[[res[0].names | myFilter]]</td>

but I keep getting this error:

Unknown provider: myFilterFilterProvider <- myFilterFilter

I also tried to inject this filter in the controller responsible for that template but no luck. Am I missing something?

Answer 1

You can build your filter as an angular module and then add that module as a application dependency or just add the filter in the application declaration.

// create a module
angular.module('myApp.filters', []).filter('myFilter', function() {
  return function(string) {
    string = string.replace('[', '');
    string = string.replace(']', '');
    string = string.replace('","', ', ');
    string = string.replace('"', '');
    return string;
  }
});
// add the module as a dependency
angular.module('myApp', ['myApp.filters']);

or

// in the application declaration
angular.module('myApp', []).filter('myFilter', function() {
  return function(string) {
    string = string.replace('[', '');
    string = string.replace(']', '');
    string = string.replace('","', ', ');
    string = string.replace('"', '');
    return string;
}});