Question

我是Angular2和observables的新手。我试图将一系列可观察量的结果返回给我的解析器，并且无法在SO上找到答案。当我只返回一个observable时，一切正常，但是当它们被链接时失败。我已将代码简化为连续调用两次相同的测试函数：

@Injectable()
export class SwResolve implements Resolve<any> {
    constructor(private swService: SwService) {}    
        resolve (route: ActivatedRouteSnapshot): Observable<MyObject> | Promise<any> | any {
             this.swService.getTestData().subscribe(data => {
                 return this.swService.getTestData();
             });
        }
}

SwComponent：

export class SwComponent implements OnInit {constructor(
    private route: ActivatedRoute,
    private router: Router
  ) { }

  ngOnInit(): void {
    this.route.data.forEach((data: any) => {
      // Handle data received
     });
  }
};

SwService：

  getTestData() {
    return Observable.create(observer => {
      let testObject : SwDataObject = {
        'labels':['value0','value1'],
        'desktop':[123,456],
        'mobile':[789,1011]
      };
      observer.next(testObject);
      observer.complete();
    });
  }

我在这里做错了什么？

谢谢！

编辑6月17日：添加更多信息，因为我花了一些时间来围绕RxJs＆＃39;方法（flatMap，mergeMap，...）。主要原因是因为我没有得到它们的功能方面。我鼓励同一条船上的人们查看Charles Scalfani的these excellent series of articles on functional programming。

Answer 1

resolve函数需要返回一个observable。你正在做的事情是不正确的，因为你只返回异步结果。您正在调用第一个observable，然后订阅该observable。所以时间过去了，只有当第一个observable得到解决时，你才会返回一个observable。

你应该使用的东西（这与Promise.then（种类）有类似的行为）是flatMap / mergeMap（RxJS5中的别名）。

将您的代码重构为：

@Injectable()
export class SwResolve implements Resolve<any> {
    constructor(private swService: SwService) {}    
        resolve (route: ActivatedRouteSnapshot): Observable<MyObject> | Promise<any> | any {
             return this.swService.getTestData().mergeMap(data => 
                 return this.swService.getTestData();
             );
        }
}

这将做的是立即返回一个观察者。

mergeMap的作用是将一个事件作为输入（在本例中是第一个getTestData（） - 调用的结果）并期望您返回另一个observable。在引擎盖下，它将订阅此可观察量并使结果变平。

关于mergeMap的文章很多，所以如果不清楚，我建议你阅读一些。这是一个好的开始：https://github.com/btroncone/learn-rxjs/blob/master/operators/transformation/mergemap.md

Angular 2：解析器中的链可观察量

1 个答案: