在Angular 4應用程序中作爲上下文菜單的引導程序下拉菜單

有沒有簡單的方法來在Angular 4應用程序的contextmenu事件中切換Bootstrap 4下拉菜單，而無需使用ngx-bootstrap庫？在Angular 4應用程序中作爲上下文菜單的引導程序下拉菜單

的引導文件說，你可以通過調用切換從JavaScript下拉：

$('.dropdown-toggle').dropdown()

於是，我就在contextmenu事件處理程序來執行這一點，但沒有奏效。我總是得到一個錯誤說：

...下拉不是一個函數

我也嘗試過直接的本地元素ElementRef從上了車調用下拉（）函數@ViewChild（）但我得到相同的錯誤。

問題在哪裏？我可以通過使用數據屬性來切換下拉菜單（所以我假設Bootstrap腳本可以在這裏工作），但是無法通過這種方式在上下文菜單中切換它，或者它是否可以？

我寧願沒有任何外部庫的解決方案。

2017-10-28 livthomas

是的，我有他們都從CDN加載Bootstrap文檔建議。 – livthomas

我認爲不要將jQuery與角度混合好得多。你爲什麼不想用'ngx-bootstrap'？ –

我說過同樣的事情，jQuery和Angular會導致你顯示問題，使用Angular做它只是如此簡單。創建一個closedMenu和closedSubMenu（如果你想要手風琴菜單）並使用類裝飾器:) – andrea06590

我終於意識到，僅僅顯示了自舉下拉菜單是不夠的，並我也想定位我點擊的上下文菜單，但不想自己實現。

這就是爲什麼我決定使用ngx-contextmenu，雖然我之前提到我不想使用任何外部庫。這是很容易設置，並使用Bootstrap下拉樣式，這是我想要完成的第一個地方。

如果有人想使用這個庫，只知道哪些情況下，上下文菜單目前默認情況下不顯示。

2017-10-30 13:14:11 livthomas

你所想要實現的可能切換下拉太複雜了，有要容易得多：

你爲什麼不只是添加[class.hidden] =「menuClosed」，如：

<div [class.hidden]="menuClosed" class="dropdown">？

只需在切換功能中將menuClosed變量設置爲true或false，它就可以完成這項工作。

編輯：有角2+很酷的事情是，你可以迅速通過使用這種顯示規則重現的jQuery/JavaScript的行爲

2017-10-28 09:21:02 andrea06590

當然，但我必須處理樣式，模糊事件等等，這些只會讓我的組件混亂。 Bootstrap爲下拉菜單提供了簡單易用的解決方案。我只是不明白爲什麼它不可能輕鬆地將其綁定到contextmenu事件。 – livthomas

回答