商店不會觸發對異步管道的更改

在我的app.component.html中，我創建了一個自定義組件（聯繫人表組件），該應用程序在我更新商店後應獲取新值（帳戶）連接的用戶成爲別人。商店不會觸發對異步管道的更改

app.component.html：

<contact-table [contacts]="connectedAccount$ |async"></contact-table>

app.component.ts：

export class AppComponent implements OnInit 
{ 
    private connectedAccount$: Observable<Account>; 
    constructor(private store:Store<any>) { 
    this.connectedAccount$ = this.store 
     .select(state=> state.connectedAccountReducer.connectedAccount); 

    this.connectedAccount$ 
     .subscribe(account1=> { 
     //the app prints any new account that comes up. It's working here. 
     console.log(account1); 
     }); 
    } 
    public ngOnInit() { 
    this.store.dispatch({ 
     type: updateConnectedAccount, 
     payload: { 
     connectedAccount: ACCOUNTS[0] 
     } 
    }); 
    } 
}

在AppComponent類的訂閱新的偉大工程，並觸發只要有任何更新。

問題是app.component.html中的異步管道不會將新帳戶發送到聯繫人表組件。我想他沒有得到任何更新通知。

我試着看看發送給聯繫人表格組件，我發現他只在第一次創建聯繫人表格組件時獲得了一個值，並且它未定義。那不是可能的，因爲我的reducer函數爲我的應用程序的初始狀態創建一個空的Account對象。

你有沒有注意到我錯過了什麼？

來源

2016-07-26 Stav Alfi

你的contact-table組件是什麼樣的？ –

嘗試使用json管道來查看視圖是否從該存儲區中選擇了任何內容。

<span>{{connectedAccount$ |async | json}}</span>

來源

2016-07-28 00:34:45 wiredprogrammer

我看到你的其他帖子詢問有關選擇。我還沒有足夠的代表在stackoverflow在那裏評論。我只是想建議你看看這些例子，如果你沒有看到他們幫忙找出設置。 https://github.com/ngrx/example-app和https://github.com/btroncone/ngrx-examples。兩人都給了我當前項目的想法。 – wiredprogrammer

檢查並確保您使用Object.assign創建對您的狀態的更改。它不應該返回一個突變的狀態。 Redux/ngrx和異步管道檢測對象散列變化時的變化（或者至少這是我的理解）。當我沒有創建一個全新的對象，但意外地改變現有狀態並返回它時，我遇到了這個問題。

引述終極版網站 - >http://redux.js.org/docs/basics/Reducers.html

我們沒有發生變異的狀態。我們用Object.assign（）創建一個副本。 Object.assign（state，{visibilityFilter：action.filter}）也是錯誤的：它會改變第一個參數。您必須提供一個空對象作爲第一個參數。您也可以啓用對象擴展運算符提議來編寫{> ... state，... newState}。

我也有RC2的異步問題，所以如果你不使用RC3或以上，我建議升級。

不是說這是它，但它是我的經驗最可能的候選人。希望這可以幫助。

來源

2016-07-27 00:39:10 wiredprogrammer

另外，我強烈建議在開發過程中使用ngrx-store-logger。它會在操作前後將狀態寫出到控制檯，並且還會在兩者之間打印出操作。 https://github.com/btroncone/ngrx-store-logger – wiredprogrammer

好的，首先感謝您的答案！對於對象中的每個更改，store都會將新狀態返回到AppComponent類中的訂閱中，如前所述。我不明白爲什麼這些更改會發送到那裏，但不會發送到異步管道。總而言之，我會將你提到的提示+開始使用ngrx-store-logger。歡迎任何其他解決方案。 –

可以包括ngrx-store-freeze - 可變狀態的問題很容易解決。我經常調試動作的另一種方式是引入一個用於記錄目的的效果。這也有助於識別問題。

來源

2017-05-29 11:05:28 claboran

商店不會觸發對異步管道的更改

回答

相關問題