提交角度2中的表单后,导航另一个页面

时间:2018-06-21 14:50:09

标签: angular typescript

我有一个HTML表单,可以捕获用户的输入并将其发送到数据库。我想做的是浏览另一个页面,例如详细信息页面,您可以在其中自动查看所有输入的信息。

我的方法是将值提交到数据库,并通过传递的提交ID导航详细信息页面。这是我的TypeScript代码:

submit() {
  this.participantService.add(this.participant).subscribe(participant => {
  this.alertifyService.success('participant successfully added');
}, error => {
  this.alertifyService.error('Problem occured!\n' + error);
});

this.router.navigate(['participants/participants-details', this.participant.id]);
}

但是,此代码只是将值发送到数据库。它并没有带我到details页。怎样才能做到这一点?

1 个答案:

答案 0 :(得分:1)

在路由到详细信息页面之前,您不必等待数据提交完成。在router.navigate() subscribe's回调中移动success

submit() {
  this.participantService.add(this.participant).subscribe(participant => {
      this.alertifyService.success('participant successfully added');
      this.router.navigate(['participants/participants-details', this.participant.id]);
  }, 
  error => {
    this.alertifyService.error('Problem occured!\n' + error);
   });
}