스타일 ngBootstrap 툴팁

Question

나는 스타일을 지정하려고하는 각도 4 구성 요소에 간단한 ngBootstrap 툴팁이 있습니다. 다른 질문에 따르면이 작동합니다 :

.tooltip-inner { 
    background-color: #00acd6 !important; 
    /*!important is not necessary if you place custom.css at the end of your css calls. For the purpose of this demo, it seems to be required in SO snippet*/ 
    color: #fff; 
} 

그러나 효과가 없습니다. 툴팁 내부 클래스가 툴팁 내에서 사용되었지만 적용되지 않음을 확인했습니다.

Answer 1

This Plunker은 어떻게 ng-bootstrap 툴팁을 스타일링 할 수 있는지 보여줍니다. 키가 하위 구성 요소에 스타일을 강제로 ** /deep/ 또는 ::ng-deep을 사용하는 것입니다 : 기본적으로

::ng-deep .tooltip-inner { 
    background-color: #00acd6; 
    color: #fff; 
} 

, 각도는 에뮬레이트 view encapsulation 당신이 그들에게 말해 않는 스타일이 하위 구성 요소에 부모로부터 전파되지 않습니다 것을 의미합니다 (예 : ::ng-deep 사용). ** /deep/

는 deprecated in Angular 4.3.0이고 링크에 따라이 또한 미래

에서 더 이상 사용되지 않습니다 있지만 ::ng-deep 지금 바람직하다