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
相关推荐
QiaoranC 2020-09-25
颤抖吧腿子 2020-09-04
liduote 2020-06-16
阿斌Elements 2020-06-11
xxuncle 2020-06-05
ChinaGuanq 2020-06-05
wanghongsha 2020-03-26
csm0 2020-03-05
shyoushine 2020-02-25
electronvolt 2020-02-12
jsonwoo 2020-01-20
ZadarrienChina 2020-01-07
wwwxuewen 2020-01-04
dynsxyc 2020-01-03
liangjielaoshi 2019-12-27
bowean 2019-12-27
wwwxuewen 2019-12-25
liwusen 2019-12-16
颤抖吧腿子 2019-12-16