角引导酥料饼的习俗造型不工作

Question

我在子组件“子组件”的一个引导酥料饼。引导造型和酥料饼做工精细在这里，但我想添加自定义样式。

我在“儿童component.html”，如下配置酥料饼

[attr.data-trigger]="'click'"
[attr.data-toggle]="'popover'"
[attr.data-placement]="'top'"
[attr.data-container]="'child-component'"

我曾在“儿童component.scss”因为它的风格

.popover {
    border: 1px solid #007CCA !important;
  }

  .popover.right .arrow:after {
    border-right-color: blue;
  }

这并没有工作这么试过这种

:host >>> .popover { background-color: #009688; color: #fff; } 

这并没有任何工作！

HTML结构是否有帮助

<child-componet id="childComp">
<section>
    <div class="basicInfo">
        <div></div>
    </div>
    <div class="additinalComp">
        <div *ngIf="dataAvailable">
            <span>Total Amount</span><span>{{amount}}</span><i tabindex="{{i}}"
                        [attr.data-content]="info"
                        class="infoPopover"
                        [attr.data-trigger]="'click'"
                        [attr.data-toggle]="'popover'"
                        [attr.data-placement]="'top'"
                        [attr.data-container]="'child-component section'"></i>
        </div>
    </div>
</section>
</child-componet>

也有像引导了骑我的风格。适用造型上不存在检查开发工具。这与内容.popover类只点击后出现。我使用.scss的角度，有什么办法，我可以做到这一点？

Answer 1

我用过

一个深孔::

代替

要么

/深/或>>>

如

:host ::ng-deep .popoverr {
  border-right-color: blue;
}

这解决了我的问题。

非常感谢 ！