查詢參數無法正常工作

Question

在我的Angular2應用程序中，我需要將一些可選參數傳遞給路由。 因爲它們是可選的，我決定使用queryParams。

我使用下面的代碼來傳遞參數：

public recoverPassword() { 
    this.router.navigate(
     ['/access/recover-password', 
     { queryParams: { 'email': this.model.email }} ] 
    ); 
} 

我得到這個網址：

http://localhost:4200/access/recover-password;queryParams=%5Bobject%20Object%5D 

正如你所看到的，參數是完全錯誤的。我無法解析它在目標組件。正確的URL應該是：

http://localhost:4200/access/recover-password;email=myemail@gg.com 

我跟着official doc，但我不能找到一個可行的解決方案。

Answer 1

queryParams應該作爲第二個參數傳遞（更準確地說，它只是一個可選的第二個參數NavigationExtras的一部分，你可以閱讀更多關於它here），而不是第一個參數的一部分，這是一個路線，你想要導航到。這應該是訣竅：

public recoverPassword() { 
    this.router.navigate(
     ['/access/recover-password'], 
     { queryParams: { 'email': this.model.email } } 
    ); 
}