Ngx-Bootstrap popover not setting correct height o

2019-07-17 10:37发布

问题:

I am trying to use ngx-bootstrap in my Ionic 2 / Angular 2 app and for some reason the popover is not displaying correctly in my view:

<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>

I don't believe my button styling should impact the popover as its rendered as a seperate component, but when the popover is displayed, both its width and height are set to 4px. I'm not sure where it's being set or if I'm missing some javascript somewhere..

app.module.ts

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

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

回答1:

Set container="body", as in demo: https://valor-software.com/ngx-bootstrap/#/popover#container-body

If it will fix size then something is affecting popover style