각도 - 매개 변수화 된 경로를 기반으로 동적 URL에서 데이터 검색

Question

매개 변수가있는 경로로 데이터를 가져 오려고합니다. HTML에서 호출은 다음과 같이이다 :

<a routerLink="my-component/2017">2017</a> 

구성 요소는 주로 다음과 같습니다

export class MyComponent implements OnInit, OnDestroy { 
    year: string; 
    destination: any[]; 

    constructor(private _route: ActivatedRoute, 
       private _info: MyService) {} 

    ngOnInit() { 
    const urlBase = 'http://...'; 
    this.subsUrl = this._route.paramMap.subscribe(
        params => { this.year = params.get('year'); }); 

    this._info.url = urlBase + this.year; 
    this.subsTree = this._info.getJsonData() 
           .subscribe(resultArray => this.destination = resultArray, 
             error => alert(error)); 
    } 

    ngOnDestroy() { 
    this.subsTree.unsubscribe(); 
    this.subsUrl.unsubscribe(); 
    } 

및 서비스 : 하나의 매개 변수에 대한

@Injectable() 
export class MyService { 
    url: string; 

    constructor(private _http: HttpClient) { } 

    getJsonData() { 
    return this._http 
     .get(this.url) 
     .catch(this.handleError); 
    } 
} 

제대로 서비스가 반환하는 데이터 (그 해). 내 문제는 내가 수동으로 페이지를 새로 고칠 때까지 데이터를 변경하지 않는 연도를 변경합니다.

Answer 1

당신이 this._route.paramMap 및 구성 요소 이름을 사용하는 것처럼 내가 당신 업데이트 제안 MyComponent 당신의 당신은 URL을 구축 routerLink와 queryParams을 사용할 수 있습니다 routerLink

<a [routerLink]="['/my']" [queryParams]="{year:'2017'}">2017</a> 

Answer 2

아래로.

<a [routerLink]="['/my-component']" [queryParams]="{year:2017}"> 
    2017 
</a> 

최종 URL은 다음과 같습니다

http://localhost:3000/my-component?year=2017