從url中獲取數據wiith params in angular2

Question

當我使用routerLink導航到另一個組件時，我很難從我的查詢字符串中獲取數據。在angular.io的dokumentation之後完成的，所以我不確定哪裏出了什麼問題。

組分1：

此組件包含routerLink其看起來像這樣：

<div class="column small-12 large-8 gutter-xsmall-up end waiting"> 
    Could not find the movie, please go <a [routerLink]="['/request']" [queryParams]="{id:MovieFromImdb.Id, title: MovieFromImdb.Title}">request it</a> 
</div> 

這產生此URL：

http://localhost:3000/request?id=tt0117500&title=The%20Rock 

組分2：

在這個組件中，我需要檢索數據，但不知何故，只有在使用console.log時它纔會保持未定義狀態。

這是我試過的。

import { Component } from '@angular/core'; 
import { AppState } from '../app.service'; 
import { Params, ActivatedRoute } from '@angular/router'; 

export class Request { 

    private typeArray: Array<any>; 
    private defaultSelection: number; 
    private Title: string; 
    private Link: string; 

    constructor(public requestService: RequestService, private route: ActivatedRoute,) { 
     this.defaultSelection = 2; 
     this.typeArray = requestService.createList(); 
    } 

    requestMovie(title, link, quality) { 
     console.log(title, link, quality); 


    } 

    ngOnInit() { 

     this.route.params.forEach((params: Params) => { 
      this.Title = params['title']; 
      this.Link = params['id']; 

     }); 

     console.log(this.route.snapshot.params['id']) 
     console.log(this.route.snapshot.params['title']) 

    } 

} 

任何可以看到我在這裏做錯了嗎？

使用最新的angular2版本。

Answer 1

這很容易，你應該使用queryParams而不是params。

ngOnInit() { 

    this.route.queryParams.forEach((params: Params) => { 
     this.Title = params['title']; 
     this.Link = params['id']; 

    }); 

    console.log(this.route.snapshot.queryParams['id']) 
    console.log(this.route.snapshot.queryParams['title']) 

} 

https://angular.io/docs/ts/latest/api/router/index/ActivatedRoute-interface.html#!#queryParams-anchor

Answer 2

您可以使用訂閱路線PARAMS像這樣： -

ngOnInit() { 
     this.route.params.subscribe(params => { 
      for(let param in params) { 
       console.log(param, "the param"); 
      } 
     }); 
}