Angular 4數據綁定概念

我正在創建一個Angular應用程序，並需要一些數據綁定的幫助。Angular 4數據綁定概念

我有一個儀表板，我有不同的小工具。每個小工具都有一個名字和一個日期。要配置/更改此設置，我創建了一個可以顯示的側邊欄。我正在使用路由器來顯示儀表板視圖。側邊欄不是儀表板的子項，它在路由器之外。

當我點擊Widget上的設置按鈕時，Sidebar應該打開，並且應該能夠顯示和更改此Widget的設置，並且Widget應該運行更新功能。

我已經試過使用共享服務，但我不認爲這是最好的解決方案，因爲我有多個小部件，每個小部件都有不同的設置對象。

來源

2017-09-24 Peter

你知道事件發生器嗎？ –

是的，我知道事件發射器，但我不知道這是否是最好的解決方案，因爲我必須使用與發射器共享的服務，因爲我想在編輯後將設置寫回。 – Peter

由於您無法綁定到您的router-outlet標記中的點擊事件，因此共享服務對於此場景來說是一個很好的呼叫。

比方說，你有一個組件（僞）：

class MyWidget { 
    widgetData: Object; 
    constructor(private myService: MyService) { } 
    handleClick(event) { 
    this.myService.sendClick({event, data:this.widgetData}) 
    } 
}

然後在你的服務，你可以使用Subject保持存儲是需要爲您的Sidebar組件的數據。

示例服務（僞代碼）：

class MyService { 
    subject = new Subject(); 
    sendClick(data) { 
    this.subject.next(data); 
    } 
    getClick(data) { 
    return this.subject.asObservable(); 
    } 
}

最後，你Sidebar就能Subscribe從服務的getClick()方法：

class Sidebar { 
    widgetData: Object; 
    constructor(private myService: MyService) { 
    myService.getClick() 
     .subscribe(v => doSomethingWithWidgetData(v)); 
    } 
}

對於其他資源：此blogpost具有良好這個概念的解釋。

來源

2017-09-24 06:35:12 bazzells

共享服務是關於這裏的事情的方法，因爲沒有父母子女之間的關係，你不能使用事件發射器。如果你想把事情放在一個檔次，並去一個更清潔的設計模式去Ngrx套房。它是這種情況下的裁縫傭人，但請記住它需要一些額外的依賴關係，並且還需要更多的代碼。

前往Ngrx是應用程序是大其他堅持shared services。

來源

2017-09-24 06:16:47

我應該如何實施「退步」？我的意思是我想將對象的變化寫回已發送對象的組件。在所有更改完成後，我是否應該在發送和取消訂閱後訂閱新對象？ – Peter

發出新的事件，觀察組件可以捕獲事件並自行更新 –

-1

您不能使用事件發射器，因爲兩個組件之間沒有關係，所以理想的方式是使用共享服務。

來源

2017-11-15 18:03:41

而應該是一個評論。 –

Angular 4數據綁定概念

回答

相關問題