當服務屬性發生變化時，角度過濾器不會更新

Question

也許這是對角度範圍的根本性誤解，但這裏就是這樣。

我有一個處理改變語言首選項服務：

languageService.js

function languageService() { 
    var language = "en"; 

    var service = { 
    getLanguage: getLanguage, 
    setLanguage: setLanguage 

    }; 

    function getLanguage() { 
    return language; 
    } 

    function setLanguage (newLang) { 
    language = newLang; 
    } 

    return service; 
} 

我也有一個過濾器，格式化的東西：

someFilter.js

function myFilter(languageService) { 
    return function(num) { 
    var french = languageService.getLanguage() === 'fr'; 

    if (french) { 
     return "is french!" 
    } else { 
     return "is other." 
    } 
    }  
} 

我嘗試在一些HTML中使用此過濾器：Blah blah {{ 'test' | someFilter }}。

它的工作原理，但僅限於負荷;如果我撥打setLanguage('en')，則綁定不會更改。

Answer 1

實際上有你的代碼的兩個問題。

首先，在服務你應該解僱摘要當你的VAR的變化。所以它會是

myApp.factory('languageService', ['$rootScope', function ($rootScope) { 
    var language = "en"; 

    var service = { 
    getLanguage: getLanguage, 
    setLanguage: setLanguage 

    }; 

    function getLanguage() { 
    return language; 
    } 

    function setLanguage (newLang) { 
    language = newLang; 
    $rootScope.digest(); 
    } 

    return service; 
}]); 

第二個也是更微妙的一個。在角度方面，只有當您在標記中傳遞它們的值發生變化（在您的情況下爲'test'）時，過濾器纔會更新，對於範圍的任何其他更改，您的過濾器將被完全忽略。

解決方法是迫使角度來解析任何消化該特定過濾器。

myApp.filter('someFilter', ['localeService', function (localeService) { 
    function filter (value) { 
    var french = languageService.getLanguage === 'fr'; 

    if (french) { 
     return "is french!" 
    } else { 
     return "is other." 
    } 
    } 

    filter.$stateful = true; // This line does the trick 

    return filter; 
}]); 

你可以在Angular Docs