angular 中的插值 - 转换为 html 注入

Question

我正在尝试研究如何使用 angular-translate（我将其用作过滤器）翻译大块 html。

我有语言 json 个文件：

{
  "PURPOSE": "Sie Damit Beabsichtigt",
  "INTRO_VID": "Sehen Sie sich das Intro-Video",
  "TOUR": "An der Tour teilnehmen",
  "PURPOSE_COPY": "<p>Die Idee hinter [snip]</p><p>Currency: {{vm.testAmount}}</p><p>Date: {{vm.testDate}}</p>"
}

然后在 html 中，我获取一个语言字符串并将其与来自视图模型 (translate:vm) 的数据一起传递给翻译过滤器，最后传递给 htmlSafe 过滤器, 这允许它被解析为 html:

<div data-ng-bind-html="'PURPOSE_COPY' | translate:vm | htmlSafe"></div>

html安全过滤器如下所示：

angular.module('kitchenapp').filter("htmlSafe", ['$sce', function($sce) {
    return function(htmlCode){
        return $sce.trustAsHtml(htmlCode);
    };
}]);

html 被很好地注入到页面中，但没有编译，即使我通过视图模型进行翻译。 :(

Answer 1

因此，无论您传递给 translate:<expression> 什么都被视为范围。如果你想传递你的实际范围，那么传递 translate:this。上面我通过了vm，然后找了vm.x: That equals to vm.vm.x，显然不存在

angular 中的插值 - 转换为 html 注入

Interpolation in angular-translate for html injection

angularjs

angular-translate