Angular 4 Popover引導程序

Question

如何在引導程序4中更改popover的大小？我嘗試在HTML中，但它不適合我。

我使用：

<ng-template #popContent popoverClass="T"> 

Answer 1

你得根據您的用例2個選擇：如果你想改變的寬度

• 所有你popovers不僅僅是定製引導的重寫Sass屬性的CSS;
• 如果您只想更改一個實例的寬度，您可以使用.popover類定位元素並覆蓋max-width屬性。

例子：

@Component({ 
    selector: 'ngbd-popover-basic', 
    templateUrl: 'src/popover-basic.html', 
    styles: [` 
    :host >>> .popover { 
     max-width: 500px; 
    } 
    `] 
}) 
export class NgbdPopoverBasic { 
} 

在plunker工作的完整示例：http://plnkr.co/edit/XHK5lN6VZlp2vwlEsKBS?p=preview

Answer 2

在component.scss加

：

:host /deep/ .popover{ 
    left: 0% !important; 
    width: 100% !important; 
    max-width: 500px !important; 
} 

它給你的警告，但很好地工作。

一點要記住：在component.ts文件，你可以使用外部CSS或風格組件