2013-02-25 77 views
16

我爲我的angularjs項目創建了一個自定義過濾器,類似於以下小提琴http://jsfiddle.net/tUyyx/Angularjs過濾器錯誤:「錯誤:未知提供者:textProvider」

​​

但是當我使用的過濾器,我收到以下錯誤

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']); 

我在做什麼錯?

回答

34

如果您看看該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 
     } 
    } 
}); 
相關問題