Ionic 4. NavParams的替代品 [英] Ionic 4. Alternative to NavParams

问题描述

我正在使用离子4.它不接受使用navparams接收数据. 这是我的发件人页面方法:

I am using ionic 4. It does not accept to receive data using navparams. Here is my sender page method:

  //private route:Router
  gotoFinalView(intent) {
    this.route.navigateByUrl(`${intent}`, this.destination);
  }

收件人页面行；

  //private navParams:NavParams  
  this.destination = navParams.data;

在ionic 4中执行此操作的正确方法是什么?我也不确定gotoFinalView方法是否有效.

What is the right approach to doing this in ionic 4. I am also uncertain whether gotoFinalView method is valid.

推荐答案

这是解决问题的有效方法 您的应用程序中的用户Angular Routers概念. 只需像下面这样声明您的路由器

This is the efficient way to solve your problem user Angular Routers concepts in your application. just declare your router like the following

您的应用程序路由模块如下

Your app routing module like the following

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import {ViewComponent} from "./crud/view/view.component";
import {CreateComponent} from "./crud/create/create.component";  
import {UpdateComponent} from "./crud/update/update.component";
import {ReadComponent} from "./crud/read/read.component";

const routes: Routes = [
{path: '', component: ViewComponent},
{path: 'create', component: CreateComponent},
{path: 'update/:id', component: UpdateComponent},
{path: 'view/:id', component: ReadComponent}
];

@NgModule({
imports: [RouterModule.forRoot(routes)],
exports: [RouterModule]
})
export class AppRoutingModule { }

:id是我要发送到该页面的参数.

:id is the parameter what i want to send to that page.

 this.router.navigate([link + '/' + id]);

在您的第一页中像这样分享您的参数.

share your parameter like this in your first page.

在第二页中，使用DI(依赖注入)注入激活的路由

In your second page inject the activated route using DI(Dependency Injection)

constructor(private actRoute: ActivatedRoute)

然后使用以下代码获取参数

Then Get your parameters using the following code

this.productID = this.actRoute.snapshot.params['id'];

这是简单的方法.您可以一次发送多个参数.

This is the simple way. You can send multiple parameter at a time.

{path: 'update/:id/:name/:price', component: UpdateComponent}

并获得如下所示的参数

this.productID = this.actRoute.snapshot.params['id'];
this.productName = this.actRoute.snapshot.params['name'];
this.productPrice = this.actRoute.snapshot.params['price'];

这篇关于Ionic 4. NavParams的替代品的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！