ionic-framework - 将点击事件转换为路由器

Question

我在旧的 ionic 3 中有以下代码，目前我必须迁移到 ionic 5。我已经用谷歌搜索了它，但仍然觉得它令人困惑。

在我的 HTML

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

在我的 TS 文件中

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

在我的 AllerhiesGroupList 页面中的 ts

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;
}

就这样 。