@輸入router.navigate angular4

Question

如何通過router.navigate在角度4環境中將值傳遞給@Input？ 內嵌正常工作：

<app-clinicdetail [clinicCode]="detailclinic"></app-clinicdetail> 

，但我要的是

this.router.navigate(['/clinicdetail']) 

與價值傳遞。

Answer 1

以下是如何通過使用導航將參數傳遞給路由加載的組件。

角4生成URL和路線的方式是這樣的：

import { Component, OnInit } from '@angular/core'; 
import { Router } from '@angular/router'; 

@Component({ 
    selector: 'app-home', 
    templateUrl: './home.component.html', 
    styleUrls: ['./home.component.css'] 
}) 
export class HomeComponent implements OnInit { 

    constructor(private router: Router) { } 

    ngOnInit() { 
    } 

    onLoadServers(id: number){ 
    this.router.navigate(['/servers', id, 'edit'],{queryParams: {allowEdit: '1'}, fragment: 'loading'}); 
    } 

} 

由於命令導航在onLoadServers（）您將收到的路由的以下觀點：

http://localhost:4200/servers/1/edit?allowEdit=1#loading

在通過這條路線零件載你可以收到的查詢參數和片段（裝載 - 在這種情況下）有：

constructor(private route: ActivatedRoute) { } 

ngOnInit() { 
    console.log(this.route.snapshot.queryParams);//{allowEdit:"1"} 
    console.log(this.route.snapshot.fragment);//loading 
}