Angular NgRx和RxJS：依赖状态选择器

我有一个组件订阅构造函数中的多个状态片

@ViewChildPComponent PGrid:PComponent； 恩戈尼特{ 这个。商店。烟斗 选择FromReports.getProcessState， takeWhile=>this.componentActive .subscribeselectedProcess=>{ 如果选择此选项，则返回流程{ this.Data=selectedProcess.Data； } }; 这个。商店。烟斗 选择FromReports.getProcessAnalysis， takeWhile=>this.componentActive .subscribeanalysisData=>{ 中频分析数据{ this.PGrid.LoadDataanalysisData； } }; } 第一个订阅订阅对象数组，而第二个订阅调用另一个组件@ViewChildPComponent PGrid中的方法。PGrid组件中的LoadData方法依赖于此。来自第一个订阅的数据

当我运行代码时，我没有定义这个。数据，尽管选择了流程。数据有价值

这个。商店。烟斗 选择FromReports.getProcessState， takeWhile=>this.componentActive .subscribeselectedProcess=>{ 如果选择此选项，则返回流程{ this.Data=selectedProcess.Data；//未定义 } }; 这意味着，当订阅状态的第二个切片并调用LoadData方法时，它会出错，因为此数据未定义

我相信这是由于可观察的工作方式，并且由于它们是异步的，一个函数可能不会在另一个函数之前返回值

Que:1为什么这个.Data=selectedProcess.Data；即使selectedProcess.Data具有值，也将此.Data设置为未定义

问2：我看过flatMap和switchMap，但由于我对RxJS和NgRx不熟悉，我对如何利用它们感到困惑。有什么建议吗

---

另一方面，我在我的ngOnInit中分别订阅了两个片段，这是首选的方式还是我应该将它们组合起来？

一切都是一个流

每个可观察到的流都应该用$命名

避免使用subscribe直到结束

在每个可观察对象发出至少一个值之前，不会发出初始值

可用于副作用和日志记录，不会影响流。是我不知道我在做什么的接线员。我自由地使用它

伪码

---

谢谢，解释得很好。我最终确实使用了combine latest，但您在示例中解释的方式为我澄清了这一点。@Abhi.Net是否使用了combine latest？再仔细考虑一下，我认为无论如何它都更合适，但我也会试试skipUntil。我把你的答案记下来，因为它实际上帮助我理解了这个问题。RxJS和Observable可能很棘手，因为你必须改变你的思维方式。。

import { of, combineLatest } from "rxjs";
import { map, delay, tap, switchMap } from "rxjs/operators";

const DATA = "selectedProcessData";
const PROCESS_ANALYSIS = "analysis";

const service = {
  getData: () => {
    return of(DATA).pipe(delay(2000));
  },
  loadData: data => {
    return of(data).pipe(delay(2000));
  }
};
const store = {
  getProcessAnalysis: () => {
    return of(PROCESS_ANALYSIS).pipe(delay(2000));
  }
};

let getSelectedProcessData = null;
const getSelectedProcessData$ = service.getData().pipe(
  tap(data => console.log(`getSelectedProcessData::${data}`)),
  tap(data => (getSelectedProcessData = data))
); // mimick getting data from a service

const getAnalysisData$ = store.getProcessAnalysis(); // mimick selection of state

const loadAnalysisData$ = combineLatest(
  getSelectedProcessData$,
  getAnalysisData$
).pipe(
  tap(([getSelectedProcessData, getAnalysisData]) =>
    console.log(`combineLatest::${getSelectedProcessData}, ${getAnalysisData}`)
  ),
  map(([getSelectedProcessData, getAnalysisData]) => getAnalysisData),
  switchMap(getAnalysisData => service.loadData(getAnalysisData))
);

loadAnalysisData$.subscribe(loadedAnalysisData =>
  console.log(`loadedAnalysisData::${loadedAnalysisData}`)
);