2017-04-26 83 views
0

我正在用redux寫我的第一個Angular 2/4應用程序(我對這種模式很陌生),而且我陷入了一個問題。 我使用@ ngrx/storeAngular + redux + ngrx:獲取數據

有一種模式,稱爲內容。 我的商店(app.store.ts)爲:

export interface AppStore { 
    contents: {id: number, Content}; 
    contentContents: {id: number, Array}; 
} 

'內容' 具有的所有內容(ID 1,內容1; ID 2,內容2)的列表。 'contentContents'有一個內容列表及其子。內容可以包含子內容。因此,我希望保留的對象,如:

{1:[2,3,6],2:[7,9,10],6:[11,4,5]}

我的減速器已經這樣做了,但我不得不面對一些問題。

我選擇了contentContents:

let subscription = this.store.select(store => { 
    return store.contentContents; 
}) 

,並訂閱了它:

subscription.subscribe(contentContents => { 

}) 

有沒有辦法訂閱來自contentContents項目?我的意思是,我想知道contentContents中的特定項目何時發生更改。示例:只有在contentContents [1]被更改時,組件的顯示內容#1纔會被警告,但是按照我構建的方式,每次更改contentContents時都會警告它。

其他的事情,如果我能解決第一個問題:有沒有辦法從商店中查詢特定ID的內容?

假設我有這個:1:[2,3,6] 內容#1具有作爲孩子的內容#2,#3和#6。如何獲得內容#2,內容#3和內容#6

+0

你不應該'subscription.subs cribe'。訂閱應該是「訂閱」的返回。 (當組件被銷燬時,這有助於取消訂閱) – Maxime

回答

0

試試這個。

subscription.map(contentContents => 
contentContents.filter(contentContent.id === reqContent.id)); 

認購

subscription.subscribe(contentContent => { 
    console.log('contentContent', contentContent); 
}) 
0

已經是前一段時間,你問這個,但也許還是有用的:

NGRX已經memoized當您使用可以選擇功能或自動創建選擇明確地創建:https://github.com/ngrx/platform/blob/master/docs/store/selectors.md

因此,要獲得關於某個特定項目的更改的通知,我會編寫一個函數,以便選擇項目。像 function getContentById(id:number,contentContents){ return contentContents.filter(contentContent.id === id)); }

東西然後創建一個可觀察到的,它利用這個功能:

content1$ = this.store.select(s => getContentById(s.contentContents,1))

並訂閱其在用戶接口與異步管道,而不是明確的在你的組件訂閱 <div>{{content1$|async}}</div> 在這方式你不需要手動取消訂閱 https://angular.io/api/common/AsyncPipe