感謝您的回覆,在此把程式碼PO上
在account的HTML:
<button type=“button” (click)=“edit(‘Edit’,item)”>
當 點下按鈕 觸發 account的component (edit function)
edit(motion, aPost){
data = {
Action: motion,
Text: JSON.stringify(aPost.Text),
top:JSON.stringify(aPost.top),
id: aPost.id,
levelForm: JSON.stringify(aPost.levelForm),
online_time: aPost.online_time,
offline_time: aPost.offline_time,
online: aPost.online,
online_id: aPost.online_id,
}
this._router.navigate(['./edit'], {
queryParams:data,//傳送資料
relativeTo: this._route,//使用相對路徑
// skipLocationChange: true,//路由參數隱藏
});
}
透過account的routing導頁至edit頁面
const routes: Routes = [
{ path: ‘edit’, component: EditComponent },
];
edit的component:
//取得傳遞參數
this.sub = this.route.queryParams.subscribe(params => {
this.Action = params[‘Action’];
});
此時在edit的頁面上的url為 home/account/edit?Action=Edit&Text=%7B"…
參數都寫在URL上面了
若我把上述的edit 的 skipLocationChange: true, 打開的話
當我click 至edit畫面時
網址為:home/account
後面的/edit 不見了,但是參數一樣有傳過去
若此時我按F5,則會回到account頁面,不會轉到account/edit的頁面,
我想要F5時還能夠停留在account/edit畫面,並且參數也能夠存在
我也有想過子組件與父組件傳輸
但這樣在account 的HTML上面寫 <Edit [post]=“post”>
的方式為一進頁面就載入edit的頁面,而我實際上的功能他是一個button鈕,
點選時才載入過去
不知道能不能路由導頁,同時又能夠子組件父組件利用inputs、outputs 傳遞參數