Question

我试图在服务中设置数据，然后在服务中填充数据后进行导航，但是我遇到了计时问题，即页面无法在服务能够填充之前进行导航。

我在服务中包含以下代码

addToken(token) {
  this.cookieService.set( 'token', token );
}

以及单击按钮时的以下代码：-

this.token.addToken(res);
this.router.navigate(['/admin']);

一旦路由器被触发，/ admin页面将使用以下标头触发端点：-

authHttpHeaders = new HttpHeaders({
    'Authorization': 'Bearer ' + this.token.getToken(),
    'Content-Type' : 'application/json',
    'Cache-Control': 'no-cache'
});

getToken（）函数仅从cookie接收令牌：-

getToken() {
  return this.cookieService.get('token');
}

如何在触发路由器导航之前确保addToken（）已完成。

我知道我可以使用setTimeout实现它，但是我真的不喜欢这样做。

我希望具有某种形式的可观察性，或者希望在触发导航路由器之前可以看到令牌不等于null或空。

预先感谢您的帮助。

Answer 1

返回一个可观察的对象，以便您可以订阅它并等待服务结束它的运行，并过滤响应以在令牌虚假时取消。

addToken(token) {
  this.cookieService.set( 'token', token );
  return of(token);
}

this.token.addToken(res)
.pipe(filter(res => !!res))
.subscribe(() => {
  this.router.navigate(['/admin']);
});

Angular-导航之前等待服务完成

1 个答案: