Ngx-Bootstrap popover没有设置正确的高度或宽度

Question

我正在尝试在我的Ionic 2 / Angular 2应用程序中使用ngx-bootstrap，由于某种原因，弹出窗口在我的视图中无法正确显示：

<button
  placement="right"
  [outsideClick]="true"
  popover="this is a teseofnwifo ef efo efoih wefohwefo wef  h ioef  whefhweofihwoeht"
  [isOpen]="true"
  triggers="click"

  ion-button full outline 
  class="flex-col rounded box-shadow" 
  color="primary" 
  style="height:100%;font-size:16px;border-width:1px;" 
  (click)="goTo('new-client')" #1>
  <i class="fa fa-user-plus text-shadow" padding style="font-size: 150px;color:red;"></i>
  <span style="font-size:32px;text-transform:none;">New Client</span>
</button>

我不相信我的按钮样式会影响弹出窗口，因为它呈现为单独的组件，但是当显示弹出窗口时，其width和height都设置为4px。我不知道它在哪里设置，或者我在某处错过了一些javascript ..

app.module.ts

import { PopoverModule } from 'ngx-bootstrap/popover';

@NgModule({
  declarations: [...],
  imports: [
    PopoverModule.forRoot()
  ]
  ...
})

Answer 1

设置容器=“body”，如演示：https://valor-software.com/ngx-bootstrap/#/popover#container-body

如果它会修复大小，那么某些东西会影响popover风格

Answer 2

我正在使用Angular9。我唯一的方法是使用ng-deep强制全局更改它。

::ng-deep popover-container {
    max-width: 100% !important;
    background-color: black !important;
    color: white !important;
}

::ng-deep .bs-popover-bottom>.arrow::after {
    border-bottom-color: black !important;
}