将点击事件转换为路由器

Question

我在旧的 ionic 3 中有以下代码，目前我必须迁移到 ionic 5。我用 google 搜索了它，但仍然觉得它很混乱。

在我的Html

(click)="onAllergiesDetailsClicked(medicalAlertGroup , 'Medical Alert')"

在我的 TS 文件中

onAllergiesDetailsClicked(allergiesGroupLists, pageTitle) {
  this.navCtrl.push(AllergiesGroupListPage, { allergiesGroupList: allergiesGroupLists, pageTitle: pageTitle });
}

在我的 ts 中的 AllerhiesGroupList 页面

let allergiesGroupList: PatientAllergiesGroup = this.navParams.get('allergiesGroupList');
this.pageTitle = this.navParams.get('pageTitle');
this.patientAllergiesLists = (allergiesGroupList.patientAllertList.sort(this.sortingDate));

Answer 1

首先创建一个名为data的服务：

export class dataService {
setvalue:any;
constructor(){}
setDestValue(param){
     this.setvalue = param;
}

getDestValue(){
    return this.setvalue;
}
}

您页面中的第二件事，您需要从以下位置发送数据：

import { Router } from '@angular/router';
import {DataService} from 'put service path here';
constructor(private dataService:DataService,private router:Router...)

onAllergiesDetailsClicked(allergiesGroupLists, pageTitle){ 
    this.dataService.setDestValue({ allergiesGroupList: allergiesGroupLists, pageTitle: pageTitle });
    this.router.navigate(["name of page to navigate to as it is named in app-routing"]);
}

并在页面中路由到：

import {DataService} from 'put service path here';

constructor(private dataService:DataService...){
    let data = this.dataService.getDestValue();
    this.pagetitle = data.pageTitle;
    this.grouplist = data.allergiesGroupList;
}

就这些了。

将点击事件转换为路由器

Converting on click event to a router

ionic-framework

ionic4

ionic5