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

问题描述

我使用的是ionic 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

你的应用路由模块如下

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屋！