角度組件溝通

我正在嘗試在我的Angular應用程序中創建一個窗口小部件系統，其中每個窗口小部件都是一個組件，其中一些組件與其他組件交互。角度組件溝通

我有圍繞我的所有組件，並調用列表後組件作爲

<app-post-list 
      [author] = "post_author" 
      [category] = "post_categories" 
      [search] = "search_terms" 
     ></app-post-list>

和我的小窗口的blogComponent

<app-widget-search (WidgetSearchEvent)="WidgetSearchEvent($event)"></app-widget-search> 
<app-widget-categories (WidgetCategoriesEvent)="WidgetCategoriesEvent($event)"></app-widget-categories> 
<app-widget-text></app-widget-text> 
<app-widget-recent-posts></app-widget-recent-posts> 
<app-widget-recent-comments></app-widget-recent-comments>

因此，一些小部件使用EvenEmmiter的輸出值發送到應用程序後列表，它再次呈現新的帖子列表，並且它工作正常。但現在我想換其他組件side-bar所有小工具，讓他們都爲：

<app-side-bar></app-side-bar>

但如果我這樣做了EventEmiter方法不工作。其他解決方案？

來源

2017-09-20 efirvida

現在您需要在側欄上創建事件emmiters並一路走下去。這看起來很醜但是唯一的方法。或者您可以在這些組件之間創建服務，如果您擁有許多此類組件，請根據您的全球或本地需要注意服務的可見性。這實際上是redux解決的問題。當你不需要一路走下去，並在emmiters中包裹發射器。但只是派遣行動，它會通知所有組件。

來源

2017-09-20 17:02:40 alexKhymenko

感謝您的提示，我看到''redux'和'ngrx'的好評，但我從來沒有使用它們，我不知道哪個更好，但這是其他問題，你能通過我一個簡單的教程或什麼？ – efirvida

是的。 ngrx是redux模式的實現，但是使用了rxjs的功能。你會發現很多鏈接在這裏https://github.com/ngrx/platform/blob/master/docs/store/README.md – alexKhymenko

但主要結賬他們的示例應用程序https://github.com/ngrx/platform/tree/master/example-app – alexKhymenko

您需要查看要與之通信的組件之間的共享服務，除非您希望每個級別都有大量的事件發射器。我通常轉而與直接的父母/子女溝通以外的服務共享數據。

來源

2017-09-20 17:03:42 joshrathke

角度組件溝通

回答

相關問題