在Angular中向父控制器附加附加功能

Question

我有一個下拉菜單元素指令本質上顯示帶有附加功能的樣式下拉列表。

我的下拉控制器有一個名爲openDropdownItems的函數，該函數在顯示列表時執行。

然後我也有另一個屬性指令稱爲setInViewWhen提供當條件爲真時的元件應該被滾動到視圖中的表達式。

<x set-in-view-when="something.item === selectedItem"> 

這只是應用了我的屬性指令一些X元素的例子。

事情是，我希望我的下拉列表項（即LIs）在它們上有這條指令，所以當用戶使用鍵盤瀏覽它們時，它會在它們傳遞可見視口時自動在視圖中滾動它們。這些項目是否顯示在可滾動容器中，或者作爲整體顯示在比瀏覽器視口更長的列表中並不真正相關。

主要想法是滾動按照下拉列表選擇。是否應該滾動主窗口。

問題

我可以讓我的setInViewWhen指令完全獨立的，但是這意味着我將不得不尋找最接近的滾動容器每當一個項目病情變化。這似乎是相當多的處理，我想避免重複（我需要遍歷DOM向上，檢查每個節點的計算的樣式表屬性OverflowY +一些額外的檢查。

這基本上似乎是多餘的，因爲每當我得到最近滾動的祖先相同的指令，所有兄弟元素可以重用的計算結果。

問題1

我如何共享兄弟指令之間這方面的知識？如果我是觸發一個事件我不知道是否接收器是兄弟姐妹或沒有任何額外的處理。

問題2

相反，當我的指令的條件爲真我理論上可以改變下拉父母的openDropdownItems先完成它的原始執行的，然後還執行滾動性檢查，並與一起使用它的結果，每一次檢查滾動容器我的指令的條件。 我可以通過指令requires屬性訪問我的指令中的下拉控制器，並在鏈接後階段進行調整。

但是這也意味着我不能在我的下拉菜單之外使用我的指令，因爲它是一個通用指令，我可以在我的應用程序的幾個元素上添加一些元素，以便在某些條件下將元素滾動到視圖中。

你會建議如何做到這一點？

Answer 1

綜上所述評論：

• 問題1，有一個兄弟指令相互溝通的直接方式。我通常創建一個封裝父指令來中繼消息。
• 按照意見，病情something.item === selectedItem引入了手表;對於選擇項目列表，這可能是許多手錶並且對性能不利。即使它現在不發生，它也是一個陷阱，並且有人可能會被誘使將其用於未來的一長串項目。我寧願在<li>的父級中有一個手錶，並在那裏添加「滾動到視圖」邏輯。
• 考慮到以前的觀點，您仍然可以有一個獨立的setInViewWhen指令（看起來很有用），並讓您的控制器X-選擇替換指令共享代碼。例如：
  • 包含公共功能的服務，
  • 含有鹼類（打字稿或JS）的角度值，並具有兩個setInViewWhen和X指令的控制器從它延伸
  • 或任何其他溶液這是方便你的情況
• 問題2相關新聞：孩子們都要求他們的父母，並改變它的方法（這種技術甚至被角認可，見ng-model和自定義控件他們重寫ngModel.$render()通過替換它）。但是，如果你這樣做，會有很多孩子改變父母的方法，這可能會導致一團糟。