Question

我正在使用Pascal Precht's angular-translate模块。我的翻译是命名空间的，例如

{
  "customer.account.header.main": "stgsdefghdsf",
  "customer.account.column.name": "sdfszdfs"
  "customer.account.column.address": "dsghfg",
  "customer.account.enum.VALUE1": "dfsgsdf",
  "customer.account.enum.VALUE2": "sdfgsdfg"
}

我正在以这种方式在模板中使用它们：

{{ "customer.account.enum.VALUE1" | translate }}

它工作得非常好，但我需要制作一个自定义翻译过滤器，它会在下方使用translate。我需要传递名称空间前缀，例如

{{ enumValue | translateEnum:"customer.account.enum" }}

其中enumValue可以是VALUE1，VALUE2，直接来自API。

不幸的是，以下是 NOT 解决方案，因为这个机制将由几个更高级别的机制使用，它只需要接受一个过滤器（可能还有过滤器参数），但不是表达式例如... + ... | filter

{{ "customer.account.enum." + enumValue | translate }}

问题是translate是异步的，因为提取语言是异步的。我不知道如何处理这个问题，因为在then承诺解决后，我没有引用可能分配的对象。我只有价值。就像原始的translate一样。

到目前为止，我已尝试过这些：

module.filter('translateEnumInstant', [
  '$translate', function($translate) {
    return function(input, namespace) {
      return $translate.instant(namespace + '.' + input);
    };
  }
]).filter('translateEnumFilter', [
  '$filter', function($filter) {
    var translateFilter;
    translateFilter = $filter('translate');
    return function(input, namespace) {
      return translateFilter(namespace + '.' + input);
    };
  }
]).filter('translateEnumPromise', [
  '$translate', function($translate) {
    return function(input, namespace) {
      return $translate(namespace + '.' + input);
    };
  }
]);

但没有一个能正常工作。前两个是同步的，它们加载前一种语言，因为它们不等待通过json获取新语言。最后一个返回一个承诺，所以只显示{}，这更糟糕。

请告诉我如何写这样的指示。

Answer 1

此自定义过滤器应该有效：

    .filter('translateEnum', function($filter) {
        var translateFilter = function (value, param) {
            return $filter('translate')(param+"."+value);
        }
        translateFilter.$stateful = true;
        return translateFilter;
    })

基于角度翻译的自定义过滤器

1 个答案: