获取 http 请求在放置请求之前执行，尽管我使用了异步等待

Question

我正在尝试通过使用异步和等待在获取请求之前执行放置请求，但是放置在获取之后执行，有人可以帮忙吗？ 这是我的代码：

export class DataStorageService {
    constructor(private dataservice: DataServiceService, private http: HttpClient) {}
    storeData() {
        const movies = this.dataservice.Movies;
        this.http.put('https://my-movies-1f9a9.firebaseio.com/movies.json', movies).subscribe(
            responseData => {
                console.log(responseData);
                return responseData;
            }
        )
    }

    fetchData() {
        let movies: IMovie[];
        this.http.get < IMovie[] > ('https://my-movies-1f9a9.firebaseio.com/movies.json').subscribe(
            responseData => {
                movies = responseData;
                console.log(movies);
            }
        )
    }

    async asyncCall() {
        await this.datastorageservice.storeData();
        this.datastorageservice.fetchData();
    }

Answer 1

看起来这里不需要subscribe ，因为您想使用async和await关键字：

export class DataStorageService {
    constructor(private dataservice:DataServiceService, private http:HttpClient) { }

    storeData(){
        const movies=this.dataservice.Movies;
        this.http.put('https://my-movies-1f9a9.firebaseio.com/movies.json', movies)
    }

    fetchData(){
        let movies:IMovie[];
        this.http.get<IMovie[]>('https://my-movies-1f9a9.firebaseio.com/movies.json')
    }
}

然后你可以使用async和await ：

async  asyncCall() {
    let result = await this.datastorageservice.storeData();
    let anotherResult = this.datastorageservice.fetchData();
}

如果您的服务返回Observable ，那么您需要调用toPromise()方法：

async  asyncCall() {
    let result = await this.datastorageservice.storeData().toPromise();
    let anotherResult = this.datastorageservice.fetchData().toPromise();
}

Answer 2

尝试将您的 http 请求设置为 promise，我个人在服务中将 http 请求分开：

文件服务：

async getData(): Promise<any> {
    const url = 'http://myrestservice';
    This.http.get(url,{Headers, observe: 'response' }).pipe(map((resp: any) => {
      return resp;
    })).toPromise();
  }

文件组件：

const request: any = await this.requestServ.getData().then((resp) => resp).catch((err) => err);

我希望它对你有用