Angularjs过滤器错误：“错误：未知提供者：textProvider”

Question

我为我的angularjs项目创建了一个自定义过滤器，类似于以下小提琴http://jsfiddle.net/tUyyx/。

​​

但是当我使用的过滤器，我收到以下错误

Error: Unknown provider: textProvider <- text <- truncateFilter 
    at Error (<anonymous>) 
    at http://localhost/javascripts/lib/angular.min.js:28:236 
    at Object.c [as get] (http://localhost/javascripts/lib/angular.min.js:26:13) 
    at http://localhost/javascripts/lib/angular.min.js:28:317 
    at c (http://localhost/javascripts/lib/angular.min.js:26:13) 
    at Object.d [as invoke] (http://localhost/javascripts/lib/angular.min.js:26:147) 
    at http://localhost/javascripts/lib/angular.min.js:28:335 
    at Object.c [as get] (http://localhost/javascripts/lib/angular.min.js:26:13) 
    at http://localhost/javascripts/lib/angular.min.js:99:481 
    at o (http://localhost/javascripts/lib/angular.min.js:66:471) 

我创建了我的模块是这样。

var myapp = angular.module('myapp', ['ngResource']); 

我在做什么错？

Answer 1

如果您看看该jsFiddle中的代码，该过滤函数返回一个函数，它将text等作为参数。它应该是这样的：

myapp.filter('truncate',function(){ 
    return function(text, length) { 
     var end = "..." 
     text = text.replace(/\w\S*/g, function(txt){return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();}); 
     if (isNaN(length)) 
     length = 23; 



     if (text.length <= length || text.length - end.length <= length) { 
      return text; 
     } 
     else { 
      return String(text).substring(0, length-end.length) + end; 
     } 
    } 
}); 

你有原因“未知供应商：textProvider”是因为你有text作为参数传递给你的过滤器。这使得Angular寻找一种不存在的名为text的服务。这是以text作为参数返回的函数。

想想这样，第一个函数（您传递给angular.filter的函数）是首先创建过滤器的函数。该功能仅在您的应用程序中执行一次。该函数的职责是创建另一个函数并将其返回，并且它返回的函数是您的过滤器。你有一个函数返回一个函数的原因是让你根据你的系统返回不同的实现。也许是这样的：

myapp.filter('truncate', function(myService) { 
    if (myService.someCondition()) { 
     return function(text, length) { 
      // return the text as usual 
     } 
    } else { 
     return function(text, length) { 
      // return the text and do some other things as well 
     } 
    } 
});