javascript - 如何使用translate和ng-bind-html的组合来生成ui-sref链接

Question

我对如何生成工作 ui-sref 有点困惑来自翻译字符串的链接。

我正在使用 Angular 1.4.9带 Angular 平移 2.9.0

这是相关代码

<div ng-bind-html="$scope.getTranslatedText(someObject)"></div>

controller {
   function(value) {
       this.$translate.isPostCompilingEnabled(); // Returns true
       return this.$translate.instant("taskNames."+value.parameters['messageId'], value.parameters);
   }
}

My translation has the following string.

taskInstructions{
    someMessageId: "Here is some text <a ui-sref=\"goSomewhere\">Some more text</a>"
}

我的翻译按预期返回文本，如果我没有ng-bind-html ui-sref 在那里，但是一旦我添加 ng-bind-html ui-sref 消失了。我尝试过编译，但似乎不起作用，尽管我不确定我是否正确使用了它。

我试过$sce.trustAsHtml在翻译的输出上，得到 ui-sref显示在 html 输出中，但它实际上并没有链接到任何地方。我觉得我在某个地方错过了一些步骤，但我似乎无法弄清楚 Angular 希望我做什么才能让 ui-sref 发挥作用。

关于使其发挥作用的最佳实践有什么想法吗？

Answer 1

不使用翻译，但这也许有帮助。我们使用 $sce 和 $state:

HTML

<section class="adb-layout-row" ng-repeat="post in vm.posts">
  <div class="adb-layout-default">
    <h5><a ng-click="vm.open(post)">{{ post.title }}</a></h5>
    <div ng-bind-html="post.html"></div>
  </div>
</section>

JS

$q.when(getPosts()).then(function(data) {
  vm.posts =  data.posts.map(function(post){
      return {
        title: post.title,
        html: $sce.trustAsHtml(post.description),
        url: post.url
      };
    });
});

angular.extend(vm, {
  open: function(post) {
    $state.go(post.url);
  }
});