第一種方法（傳單個或者多個引數）：

主頁面方法：

先新增引用：private _routes: Router,

Details(PBSCode) { this._routes.navigate(['pbs-manage/pbs-detail', PBSCode]); } 路由： //  reuse: true 可以使本頁面不關閉 { path: 'pbs-detail/:PBSCode', component: PBSDetailComponent, data: { title: '詳情', reuse: true } }
子頁面接收： ngOnInit() { this.route.queryParams.subscribe((e) => { this.PBSCode= e.get('PBSCode'); }); } 缺點：該方法會把引數顯示在位址列上 第二個方法（傳物件）： 主頁面: private _routes: Router, 新增引用： Details(bb,cc) { this.router.navigate(['/workOrder-manage/challenge-list'], { queryParams: { aa: bb, cc: dd } }); } 子頁面： ngOnInit() { this.route.queryParams.subscribe((e) => { this.aa= e.aa; this.cc = e.cc ; }); } 備註：該方式與第一個方法的缺點一致,好處是不用配置路由 第三種方式（模態窗） // 補充資訊 主頁面方法： // componentParams中的是傳的值 content是子頁面的名字 EditCarrier(ContractID) { const options = { wrapClassName: 'modal-lg custom-modal', content: PublicContractEditCarrierComponent, footer: false, componentParams: { ContractID: ContractID } }; // 子頁面關閉觸發的事件 this.modal.open(options).subscribe(result => { if (result === 'onDestroy') { this.GetDatas(0); } }); } 子頁面接收： @Input() set dataci(ci: number) { this.ContractID = ci; } 備註：主頁面的傳值引數名與子頁面接收的引數名必須一致 第四中： 主頁面： html: //子頁面的元件名字  <app-back-admin-assessment-early-warning-index (receive)="GetParameters($event)"></app-back-admin-assessment-early-warning-index> ts頁面： GetParameters(e) { console.log(e); } 子頁面： // receive這個名字隨意 但主頁的觸發方法的名字要與這裡的名字一致 @Output('receive') checkedBack = new EventEmitter<any>(); //觸發這個方法就可以傳值到主頁面 this.checkedBack.emit(this.params);