简体   繁体   English

带有 NGRX-Data 的 Angular 嵌套组件数据流

[英]Angular nested components data flow with NGRX-Data

I have a two components whith a shared service and the service is connected to an NGRX Data store.我有一个共享服务的两个组件,该服务连接到一个 NGRX 数据存储。 The Button-Component triggers a request via the service by calling the getByKey() method of NGRX-Data. Button-Component通过调用 NGRX-Data 的getByKey()方法通过服务触发请求。 The Display-Component has an Observable which is subscribed with the async pipe. Display-Component有一个通过异步管道订阅的 Observable。

// Observable subscribed with async pipe
identifiers$: Observable<Identifiers> = new Observable<Identifiers>();

// Method called by the `Button-Component`
callApi(key) {
    // When this emits I want to map the value to `identifiers$`
    this.service.getByKey(key);
}

So far I'm not able to trigger the call with the Subscrption in the Display-Component .到目前为止,我无法使用Display-Component的 Subscrption 触发调用。 It works if I manually subscribe in the Service and the entities$ in the Store are updated too.如果我手动订阅 Service 并且 Store 中的entities$也更新,则它会起作用。 I could use that but then I need some logic to store the key which I would like to avoid.我可以使用它,但是我需要一些逻辑来存储我想避免的key

So how can I map from the Observable returned by the Store to the one of the Display-Component in one go?那么如何从 Store 返回的 Observable 一次性映射到Display-Component之一呢?

The store is share for all child modules and their components, if you use .forRoot in AppModule then it means all the application is connected to the same store and shares its data.这家商店的份额为所有子模块及其组件,如果你使用.forRootAppModule那么就意味着所有的应用程序连接到相同的存储和共享其数据。

In your case I would check the selector of identifiers$ to ensure what and how it receives because the described flow works in ngrx-data and doesn't require any additional changes.在你的情况下,我会检查identifiers$的选择器以确保它接收什么以及如何接收,因为所描述的流程在 ngrx-data 中工作并且不需要任何额外的更改。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM