Angular2 - 使用html插入字符串

Question

如何使用angular2使用html插入字符串.我知道在角度1.x有$interpolate(templateString)(miniScope);但我没有找到相同的angular2.

假设我有这样的模板: Hello my name is {{name}}

和绑定就像 name: "<strong>Pardeep</strong>"

所以我想要结果

您好,我的名字是Pardeep

请参阅angular1

对于angular2看到这里,但我无法理解清楚

任何帮助？

Answer 1

您只需使用[innerHTML]指令即可完成它.

http://plnkr.co/edit/6x04QSKhqbDwPvdsLSL9?p=preview

import {Component, Pipe} from '@angular/core'

@Component({
  selector: 'my-app',
  template: `
            Hello my name is <span [innerHTML]="myName"></span> 
  `,
})
export class AppComponent {

  myName='<strong>Pardeep</strong>';

}

更新:

在RC.1发布后,我检查它不起作用.

让我们说它可以使用RC.4你可以使用DomSanitizationService如下所示,

@Component({
  selector: 'my-app',

  template: `
    <div [innerHTML]="myCheckbox"></div>
  `,
})
export class AppComponent {

  dangerousUrl='<input type="checkbox">';

  constructor(sanitizer: DomSanitizationService) {

    this.myCheckbox= sanitizer.bypassSecurityTrustHtml(this.dangerousUrl);
  }
}

http://plnkr.co/edit/Yexm1Mf8B3FRhNch3EMz?p=preview