Angularjs Angular 5使用forkJoin组合和链接并行调用不起作用

我正在寻找一种方法，在加载页面上的所有控件后执行一些操作。通过调用http get并行加载这些控件

我尝试了与下面类似的代码，但似乎没有奏效。如果工作正常，sometext应该显示“完成”。没有。我不确定我是否正确理解forkJoin的工作原理。我曾经使用承诺在Angular 1.x中进行这种链接。感谢您在理解问题和解决方案方面给予的任何帮助

我正在寻找的解决方案类似于Angular 1.x的这个问题：

完整代码位于

来源是src/dash.ts

这是Angular 5和typescript

export class dash implements OnInit {
  sometext = 'Some text ...';
  private httpOptions = {
    headers: new HttpHeaders({ 'Content-Type': 'application/json' })
  };
  constructor(private http: HttpClient) {}
  click_me(): void {
    this.sometext = '';
    forkJoin([
      of(this.first_()),
      of(this.second_())
      ]).subscribe(val => {
        this.sometext = 'done...';
      })
  }
  first_(): void {
    this.http.get<any>('data/sampledata.json',this.httpOptions).subscribe(val=> {
    this.sometext = val.items[0].value;
    });
  }
  second_(): void {
    this.http.get<item[]>('data/sampledata.json',this.httpOptions).subscribe(val=> {
    this.sometext = val.items[1].value;
    });
  }
}

导出类dash实现OnInit{
sometext='sometext…'；
私有httpOptions={
标题：新的HttpHeaders（{'Content-Type'：'application/json'}）
};
构造函数（私有http:HttpClient）{}
单击\ me（）：void{
this.sometext=''；
分叉连接([
关于（这个，第一个），
关于（这个第二个）
]).订阅（val=>{
this.sometext='done…'；
})
}
第一个字母：void{
this.http.get（'data/sampledata.json'，this.httpOptions）.subscribe（val=>{
this.sometext=val.items[0].value；
});
}
第二个字母：void{
this.http.get（'data/sampledata.json'，this.httpOptions）.subscribe（val=>{
this.sometext=val.items[1]。值；
});
}
}

主要原因是您的

first（）

和

second（）

没有返回可观察的

.forkJoin（）
只能接收一个数组中的
观察值，并行激发它们，然后它必须等待所有观察值完成，然后才能开始发出结果值。您的
complete（）
处理程序从未执行的主要原因是
.forkJoin（）
中首先没有
可观察对象，因此它们都无法完成，并且您的
.forkJoin（）
将永远不会发出

这是你应该做的。对于
first（）
和
second（）
，让它们返回一个
可观察的
。如果要在执行这两个命令时更改
this.sometext
，请使用操作符
.do（）
：

请注意，由于
Observable.forkJoin（）
并行激发它们的请求，因此不能保证
first（）
将在
second（）
之前执行
first（）
主要原因是
first（）
和
second（）
不会返回
Observable
.forkJoin（）
只能接收一个数组中的
观察值，并行激发它们，然后它必须等待所有观察值完成，然后才能开始发出结果值。您的
complete（）
处理程序从未执行的主要原因是
.forkJoin（）
中首先没有
可观察对象，因此它们都无法完成，并且您的
.forkJoin（）
将永远不会发出

这是你应该做的。对于
first（）
和
second（）
，让它们返回一个
可观察的
。如果要在执行这两个命令时更改
this.sometext
，请使用操作符
.do（）
：

请注意，由于
Observable.forkJoin（）
并行激发它们的请求，因此不能保证
first（）
将在
second（）之前执行
可能重复的@Igor你能解释一下这个问题是怎么重复的吗？这个问题的解决方案是我在Angular 1.x中使用的。但是对于TypeScript和rxjs，我不知道该怎么做。对于使用rxjs库的angular（angular 2和更高版本），也有一些特定的答案。请参阅：回答中指出的Typescript不支持承诺。你有什么建议？谢谢。可能是@Igor的副本。你能解释一下这个问题是怎么重复的吗？这个问题的解决方案是我在Angular 1.x中使用的。但是对于TypeScript和rxjs，我不知道该怎么做。对于使用rxjs库的angular（angular 2和更高版本），也有一些特定的答案。请参阅：回答中指出的Typescript不支持承诺。你有什么建议？谢谢，谢谢。在这种情况下，第一个和第二个的顺序并不重要。谢谢。在这种情况下，第一个和第二个的顺序并不重要。
first_(): Observable<any> {
    this.http.get<any>('data/sampledata.json', this.httpOptions)
        .do(val => {
            this.sometext = val.items[0].value;
        });
}

second_(): Observable<any> {
    this.http.get<item[]>('data/sampledata.json', this.httpOptions)
        .do(val => {
            this.sometext = val.items[1].value;
        });
}

click_me(): void {
    this.sometext = '';
    forkJoin([
        of(this.first_()),
        of(this.second_())
    ]).subscribe(val => {
        this.sometext = 'done...';
    })
}