Angularjs 如何使用角度转换处理内联html

假设我想在文本中内联一个图标

'Please scan the <span class="icon ion-barcode"></span> on the screen'

“请扫描屏幕上的”

我该如何在不将句子分成两部分的情况下，将其添加到具有角度翻译的翻译中

'{{ 'scan_1' | translate }} 
 <span class="icon icon-barcode"></span> 
 {{ 'scan_2' | translate }}'

....

.config(['$translateProvider', function ($translateProvider) {
  var translations = {
    en : {
      scan_1 : 'Please scan the', 
      scan_2 : 'on the screen', 
    }
  };

  $translateProvider
    .translations('en', translations.en)
    .preferredLanguage('en');
}])

{{'scan_1'| translate}
{{'scan_2'| translate}}'
....
.config（['$translateProvider'，函数（$translateProvider）{
变量转换={
嗯:{
扫描1:'请扫描'，
扫描_2:'在屏幕上'，
}
};
$translateProvider
.translations（'en'，translations.en）
.首选语言（“en”）；
}])

这可以通过

translate

指令实现：

---

和。
翻译服务不支持这种情况。为什么不简单地复制整个文本（包括元素）并为其设置翻译设置呢？翻译是作为文本插入的，而不是HTML。如果您在翻译中放置html标记，它们将被转义，导致
请扫描屏幕上的
。可能重复
<ANY translate="{{toBeInterpolated}}"></ANY>