我的“this.router.navigate”在我的Angular 2应用程序中不会触发

Question

我有一个函数可以向API发送一个post请求，并为新创建的文档取回一个对象。我在这个函数调用中成功地从API中获取数据，但是当我得到一个带有正确的“_id”信息并记录到控制台的新对象时，我的“this.router.navigate（['/ record'，this。 _id]）“不触发。我假设我应该能够像我在做的那样将它粘贴到该函数的末尾，以便在数据返回时以编程方式处理导航。但它不起作用。当该功能被触发时，该应用程序根本无法导航。我在这里错过了什么？

createRecord() { 
     this.recordsService.createRecord().subscribe(
     data => { 
      // refresh the list 
      console.log(data); 
      return true; 
     }, 
     error => { 
      console.error("Error creating record..."); 
      return Observable.throw(error); 
     } 
     ); 
     console.log('createRecord function initiated...'); 
     this.router.navigate(['/record', this._id]); 
    } 

我的服务是这样的：

createRecord() { 
     const headers = new Headers({ 'Content-Type': 'application/json' }); 
     const options = new RequestOptions({ headers: this.headers }); 
     const body = JSON.stringify({deleted: true}); 
     return this._http.post 
     ('https://api.somesite.com/v0/records?apikey=someapikey', 
     body, options).map((res: Response) => res.json()); 
    } 

Answer 1

其实，你应该叫router.navigate当你成功地得到您的数据（在成功回调）

createRecord() { 
     this.recordsService.createRecord().subscribe(
     data => { 
      // refresh the list 
      this.router.navigate(['/record', data._id]); 
     }, 
     error => { 
      console.error("Error creating record..."); 
      return Observable.throw(error); 
     } 
     ); 
    }