angular标签使用[innerHTML]并且解决样式问题以及在ts拼写div,html代码时无法在html页面生成问题

最新推荐文章于 2024-02-19 03:15:00 发布

VIP文章今夜你是我的模特

最新推荐文章于 2024-02-19 03:15:00 发布

阅读量5.9k

点赞数 3

分类专栏：前端js技术，问题集合文章标签：管道 pipe [innerTHML] angular中html的样式

本文链接：https://blog.csdn.net/dalqyou/article/details/86084519

版权

话不多说，刚使用angular不久的同学有时脱离不jq 的使用以及习惯在js中拼好div 然后append到html中，所以发现在angular中这个方法行不通，拼好的div 不能在页面生成。下面直接贴代码，有两种方法

<div [innerHTML]="showHtml" > </div>通过这么写就能把showHtml中拼好的div 展示在html页面中，

ts中：
this.showHtml =   '<p style="font-weight: bold;">1、资源下发提醒</p>' 

**html中：**
 <div [innerHTML]="showHtml " ></div>

到这里就发现是不比通过jq 获取节点然后在$("#xx").append("

") 添加到对应的div下面方便的多了。

但也会发现一个问题就是，没有样式，样式不生效，下面就是贴两种方法的代码

方法一：

**ts:**
在使用的页面引入
import { DomSanitizer } from '@angular/platform-browser';
  constructo

关注