angular2展現包含html標籤的內容

angular2採用{{變量}}的方式展現數據，但字符串中包含html代碼，會被自動過濾掉。

採用<span [innerHTML]="b"></span>這種方式能夠直接將html代碼展現出來。

 

但這樣寫又會存在一個新問題：展現的html標籤中，style的屬性會被過濾掉。

坑~~~

 

解決方法：使用ng2服務DomSanitizer中的bypassSecurityTrustHtml 方法

import { Component, OnInit } from '@angular/core';  
import { DomSanitizer } from '@angular/platform-browser';  
  
@Component({  
    selector: 'my-zhizaoZixunDetail',  
    templateUrl: './zhizaoZixunDetail.component.html',  
    styleUrls: [ './zhizaoZixunDetail.component.css' ],  
    providers: [ZhizaoZixunDetailService]  
  })  
export class ZhizaoZixunDetailComponent implements OnInit {  
    constructor(private activatedRoute: ActivatedRoute,  
        private domSanitizer: DomSanitizer,  
        private zhizaoZixunDetailService: ZhizaoZixunDetailService) {};  
    ngOnInit(): void {  
        var results = this.zhizaoZixunDetailService.getData(this.zhizaoZixun);  
        results.then((response) => {  
            if(response!=null) {  
                this.detail=response;   
                this.detail["wenzhNeir"]=  
            this.domSanitizer.bypassSecurityTrustHtml(this.detail["wenzhNeir"]);  
            }  
         }  
    }  
}    

　　

用domSanitizer.bypassSecurityTrustHtml轉換一下就能夠解決了。

 

參考：http://www.jianshu.com/p/ef008e9c07de