我正在嘗試使用角度將物件從一頁發送到重新路由的頁面。我發現了類似的主題，我試圖重現這些主題，但我仍然得到未定義的價值。雖然我似乎根據這個主題做對了。
如何在Angular中的頁面之間傳遞物件？
獲取路由查詢引數
使用物件作為 Angular 的 get 方法的引數
https://www.angularjswiki.com/angular/get-query-parameters-in-angular/
goToOrderPage(){
//code to create object
let order = new Order("BTWNummer", "mail", this.totalPrice, this.sendCosts, orderlineset)
console.log(
"before send"
order.btw " - " order.totalPrice " - " order.shippingcost " - " order.email
);
this.router.navigate(["/orderinfo"], { queryParams: order });
}
該物件記錄良好，發送它沒有錯誤。我被重新路由到下一頁“/orderinfo”：
export class OrderinfoComponent implements OnInit {
order!:Order;
constructor(private route: ActivatedRoute) { }
ngOnInit(): void {
this.route.queryParams.subscribe(params=> {
console.log(params);
this.order = params['order'];
console.log(
this.order.btw " - " this.order.totalPrice " - " this.order.shippingcost " - " this.order.email
);
})
}
}
在記錄代碼時，這里確實得到了一個未定義的值。給出查詢引數的 console.log 確實記錄了 {order: Object object} 我嘗試了一些其他的東西，除了這里寫的代碼，但我無法得到決議的值。如何正確決議訂單物件中的引數值？
uj5u.com熱心網友回復：
您不能只將整個物件作為查詢引數傳遞。您需要以某種方式對其進行編碼，因為查詢字串引數表示為...字串。您可以將每個訂單屬性作為單獨的查詢字串引數發送，或者尋找其他更符合人體工程學的方法來實作所需結果。例如，您可以使用導航附加功能state
this.router.navigate(["/orderinfo"], { state: order });
然后OrderinfoComponent你可以在導航結束之前訪問它（通常在組件的建構式中），如下所示：
this.order = router.getCurrentNavigation()?.extras.state as Order;
在導航結束后使用也可以訪問它history.state。
您還可以包含一個服務，用于保存您希望在某些組件之間共享的狀態。
轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/507198.html