如何将参数从标签容器传递到离子4中的一个标签

Question

我有一个离子标签应用程序，需要将参数从TabsPage.ts传递到Tab2Page.ts才能在Tab2Page.html中使用。标签与路由系统一起工作。我在谷歌上搜索了一下，但没有发现任何帮助。感谢您的帮助。

选项卡页码：

import { Component } from '@angular/core';
@Component({
selector: 'app-tabs',
templateUrl: 'tabs.page.html',
styleUrls: ['tabs.page.scss']
})
export class TabsPage {
paramToPass: string; 
constructor() {
paramToPass = 'test';
}

表2页码：

import { Component} from '@angular/core';
@Component({
selector: 'app-tab2',
templateUrl: 'tab2.page.html',
styleUrls: ['tab2.page.scss']
})
export class Tab2Page  {
constructor() {
//here I need to get paramToPass parameter
}
}

选项卡Page.html：

<ion-tabs>
<ion-tab-bar slot="bottom">   
<ion-tab-button tab="tab2">
<ion-icon name="apps"></ion-icon>
<ion-label>Tab Two</ion-label>
</ion-tab-button>
</ion-tab-bar>
</ion-tabs>

标签路由器模块：

import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { TabsPage } from './tabs.page';
const routes: Routes = [
{
path: 'tabs',
component: TabsPage,
children: [
{
...
{
path: 'tab2',
children: [
{
path: '',
loadChildren: () =>
import('../tab2/tab2.module').then(m => m.Tab2PageModule)
}
]
},
]
},
...
{
path: '',
redirectTo: '/tabs/tab1',
pathMatch: 'full'
}
];
@NgModule({
imports: [RouterModule.forChild(routes)],
exports: [RouterModule]
})
export class TabsPageRoutingModule {}

Answer 1

尝试使用Input((属性通过选项卡传递数据：

请参阅Angular文档：@Input((-属性