2015-06-24 160 views
0

定義,我希望用戶擁有更改格式的選項格式化的飛行日期,所以我創建了一個過濾器這樣

<ul> 
<li ng-repeat"item in items"> 
     <h2>{{item.date | formatDate }} </h2> 

</li> 
</ul> 

然後在我的代碼

myapp.filter('formatDate', function(){ 
    return function(date) { 
    return formatDateFunction(date) 
    } 
    } 

    function formatDateFunction(unix_epoch){ 

    var date = new Date(unix_epoch);  
    var language = $scope.desiredLanguage 
    var time = date.toLocaleTimeString(language, options); 
    return time; 
    } 

    myapp.controller('MyCtrl',[$scope, 
     function MyCtrl($scope){ 
      $scope.desiredLanguage = 'en-us'; 
      --code omitted 

的問題是,過濾器調用需要在控制器的$範圍內定義的值,使得我現在寫的代碼的方式,值是一個函數不可用,即$ scope在format filt中不可用呃,也不是它所調用的formatDateFunction

問題:如何訪問上面的過濾器中的示波器,或者相反,如何安排它以使<h2>{{item.date | formatDate }} </h2>在控制器上調用過濾器?

+0

嘗試在formatDateFunction函數中使用this.desiredLanguage –

+0

@JorgeCasariego不起作用。 formateDateFunction中的'this'是'undefined''formatDateFunction'和定義了'$ scope.desiredLanguage'的'MyCtrl'之間沒有連接,即$ scope在formatDateFunction中不存在。 – BrainLikeADullPencil

回答

3

你已經混淆了你對問題的分離,你應該提供所需的語言作爲你的過濾器的參數。這意味着,你仍然會在控制器中定義desiredLanguage的範圍變量一拉

$scope.desiredLanguage = 'en-us' 

但你把它傳遞給你的過濾器通過HTML的參數。這意味着你的控制器保持不變,你的過濾器變:

myapp.filter('formatDate', function(){ 
    return function(date,language) { 
      return formatDateFunction(date,language) 
    } 
} 
function formatDateFunction(unix_epoch, language){ 
    var date = new Date(unix_epoch);  
    var time = date.toLocaleTimeString(language, options); 
    return time; 
} 

然後在你的HTML你可以用:

<h2>{{item.date | formatDate:desiredLanguage }} </h2> 

這使的範圍和參數分離在你的控制,這鼓勵重用,模塊化和可測試性。

+0

好的,謝謝你我想出了你的幫助,但由於問題的要點是如何將範圍傳遞給過濾器,所以讀者可能會更清楚這個問題:'formatDate:desiredLanguage'參數'desiredLanguage'在$ scope中的控制器中定義,比如'$ scope.desiredLanguage',以便將範圍傳遞給過濾器。 – BrainLikeADullPencil

+0

經過更新以反映您的建議,因爲您是對的,它可能會更清晰。 – mikeswright49