angularjs - 过滤器不刷新

Question

我遇到了本地化过滤器的刷新问题。加载文件时， View 不会刷新。我试过 $scope.$apply()和 $filter("localization")(localizationService.text) ，两者都不起作用。

本地化服务:

angular
    .module("myApp")
    .factory("localizationService", function () {
        var service = {
            text: null,
            language: "en"
        };

        return service;
    });

本地化过滤器:

angular
    .module("myApp")
    .filter("localization", function(localizationService) {
        return function (value) {
            if (localizationService.text && localizationService.text.hasOwnProperty(value)) {
                return localizationService.text[value];
            }
            return value;
        }
    });

Controller 自动刷新要使用的文件:

    $scope.$watch(function () {
        return $location.path();
    }, function () {
        var fileName = "../Localizations/" + $location.path().substring(1) + "/localization-" + localizationService.language + ".json";

        $http.get(fileName).then(function (response) {
            localizationService.text = response.data;
            //$filter("localization")(localizationService.text);
            //$scope.$apply();
        });
    });

本地化-en.json:

{
  "test": "this is working !"
}

HTML :

<div>{{'test' | localization}}</div>

这段代码写 test而不是 this is working ! .

我怎样才能解决这个问题 ？

Answer 1

从此版本 1.3.0-rc.2 , 过滤器默认是无状态的。这意味着只有在左侧表达式发生变化时才会重新评估过滤后的表达式。

你有这个:

<div>{{'test' | localization}}</div>

test在这种情况下显然永远不会改变，所以整个表达式只会被评估一次。

您需要将过滤器标记为有状态:

app.filter("localization", function(localizationService) {

  function localization(value) {

    if (localizationService.text && localizationService.text.hasOwnProperty(value)) {
      return localizationService.text[value];
    }
    return value;
  }

  localization.$stateful = true;

  return localization;
});

演示: http://plnkr.co/edit/YIzmH3lR9350McprusAA?p=preview