zoukankan      html  css  js  c++  java
  • ng4.0 使用[innerHTML]动态插入的富文本如何设置样式

     方法一:在css中设置样式

    for CSS added to the component

    :host ::ng-deep mySelector { 
      background-color: blue;
    }

    for CSS added to index.html

    body ::ng-deep mySelector {
      background-color: green;
    }

     

    方法二:在ng生命周期中设置样式

    使用方法二,我们得了解ng4的生命周期;经过测试,在ngAfterViewChecked方法中可以设置样式

    名称

    时机

    接口

    范围

    ngOnChanges

    当被绑定的输入属性的值发生变化时调用,首次调用一定会发生在 ngOnInit之前。

    OnChanges

    指令和组件

    ngOnInit

    在第一轮 ngOnChanges 完成之后调用。 ( 译注:也就是说当每个输入属性的值都被触发了一次ngOnChanges 之后才会调用ngOnInit ,此时所有输入属性都已经有了正确的初始绑定值 )

    OnInit

    指令和组件

    ngDoCheck

    在每个 Angular 变更检测周期中调用。

    DoCheck

    指令和组件

    ngAfterContentInit

    当把内容投影进组件之后调用。

    AfterContentInit

    组件

    ngAfterContentChecked

    每次完成被投影组件内容的变更检测之后调用。

    AfterContentChecked

    组件

    ngAfterViewInit

    初始化完组件视图及其子视图之后调用。

    after initializing the component's views and child views.

    AfterViewInit

    组件

    ngAfterViewChecked

    每次做完组件视图和子视图的变更检测之后调用。

    AfterViewChecked

    组件

    ngOnDestroy

    当 Angular 每次销毁指令 / 组件之前调用。

    OnDestroy

    指令和组件

  • 相关阅读:
    CMS 阶段性了结
    Java 代码监控 JVM 运行状态 —— 记一次 JVM 调优的毛招
    ClassLoader PPT 总结
    记一次 CMS 回收异常问题 —— 跨代引用和循环依赖
    读懂 GC 日志
    ClassLoader 学习笔记
    java 可见性简单总结
    Kafka 基本原理整理
    秒杀系统个人总结
    centos 7 mongodb4.0 安装配置
  • 原文地址:https://www.cnblogs.com/minigrasshopper/p/8260257.html
Copyright © 2011-2022 走看看