angular 12 ng-deep 使用注意事项

Fork Me On Github

ng-deep 使用

a.scss

scss
     
::ng-deep {
    a {
        color: #fff;
    }
}
12345

ng-deep 表示里面的样式是公共的,需要影响子组件的样式。

可以理解为 vue 中的不带 scoped 属性的 style 标签

上面的样式表示,当打开 a 组件之后,样式开始生效,如果从 a 离开了样式依然会起作用,

注意

::ng-deep 里面的样式是影响全局的,如果想只作用与一个模块下

请使用一个规则名放在最外面

scss
     
.page ::ng-deep {
    a {
        color: #fff;
    }
}
12345
点击查看全文
标签: angular
0 853 0
在 angular 项目中实现对页面的访问控制
按下回车键,焦点移动到下一个表单或提交表单
使用ng-template 显示tree结构数据
使用 ViewContainerRef.createComponent 替代 ComponentFactoryResolver
angular 12使用 KaTex 显示 AsciiMath 格式的公式