我試圖使ng-bootstrap中的非畫布更寬，但它不起作用。任何建議或幫助都很重要。蒂亞。

以下是HTML代碼:

<ng-template #newoffcanvas let-offcanvas>
        <div class="offcanvas-header bg-primary text-white">
            //some stuff here
        </div>
        <div class="offcanvas-body">
            //some stuff here
        </div>
</ng-template>

這是原始尺寸:

我可以在瀏覽器的開發工具中使用元素選擇器來更改它，如下圖所示:

或者如果我取消選中這個框，它也會變大(自動？)，非常適合我。

對于我的CSS，我嘗試了幾個自定義的CSS，但不起作用。我把這個放在SCSS組件文件里了。

.custom-offcanvas-width {
    --bs-offcanvas-width: 600px !important;
  }

超文本標記語言

<ng-template #newoffcanvas let-offcanvas>
        <div class="offcanvas-header bg-primary text-white custom-offcanvas-width">
            //some stuff here
        </div>
        <div class="offcanvas-body custom-offcanvas-width">
            //some stuff here
        </div>
</ng-template>

我也嘗試了內嵌樣式，但也不起作用。

style="--bs-offcanvas-width: auto;"

這個解決方案對我不起作用...當我在offcanvas-header和offcanvas-body周圍添加一個div時，它產生了一個不同的問題；我的offcanvas不再顯示任何東西(白屏)，我不知道為什么(其他地方的不同問題)...

這個解決方案對我很有效:

在您的CSS中，添加一個這樣的類:

.wide-panel {
   width: 1000px !important;
}

然后在您的Angular組件中，注入NgbOffcanvas服務，并使用NgbOffcanvasOptions上的panelClass屬性來設置您的自定義寬度:

constructor(private offCanvas: NgbOffcanvas) { }

openPanel() {
   this.offCanvas.open(PanelComponent, {
      position: 'end',
      panelClass: 'wide-panel'
    });
}

希望這有所幫助:)