仅将选项卡中的参数发送到其他页面 - Ionic2
Send Only Parameters from tabs to other page - Ionic2
我正在使用 ionic 2 框架,我需要将参数从我的选项卡发送到其他页面,该页面不在我的选项卡上...
我知道方法“this.navCtrl.push(view,{parameters})”但是我只需要发送参数,不想打开其他页面,只有参数。请帮助我。
在我的代码中,我需要发送参数 "rut"。
tabs.html:
<ion-menu [content]="content" >
<ion-header>
<ion-toolbar>
<img class="avatar" src="assets/img/i2.png">
<div class="name-user">{{nombre}} {{apellido}}</div>
<div class="rut-user">{{rut}}</div>
</ion-toolbar>
</ion-header>
<ion-content >
<ion-list>
<div class="items-menu">
<div class="item-menu" (click)="scan()">
<ion-icon name="md-qr-scanner"></ion-icon>
<div class="title">Escanear Producto</div>
</div>
<div class="item-menu" (click)="modificarPerfil()">
<ion-icon name="md-person"></ion-icon>
<div class="title">Perfil</div>
</div>
<div class="item-menu">
<ion-icon name="md-settings"></ion-icon>
<div class="title">Opciones</div>
</div>
<div class="item-menu">
<ion-icon name="md-information-circle"></ion-icon>
<div class="title">Acerca De</div>
</div>
<div class="item-menu" (click)="cerrarsesion()" >
<ion-icon name="md-log-out"></ion-icon>
<div class="title">Cerrar Sesion</div>
</div>
</div>
</ion-list>
</ion-content>
</ion-menu>
<ion-nav [root]="rootPage" #content swipeBackEnabled="true" ></ion-nav>
<ion-tabs color="primary">
<ion-tab [root]="tab1Root" tabTitle="Home" tabIcon="home"></ion-tab>
<ion-tab [root]="tab2Root" tabTitle="Carro" tabBadge="{{num}}" tabIcon="cart" tabBadgeStyle="danger" ></ion-tab>
<ion-tab tabTitle="Perfil" tabIcon="md-person" (ionSelect)="modificarPerfil()"></ion-tab>
</ion-tabs>
我假设您有 3 个页面:tabsAll, tab1Root, tab2Root
其中 tabsAll
是整体,显示了其代码。
您需要将选项卡中的参数发送到其他页面。我假设其他页面是其他选项卡?您可以使用 rootParams
将参数从选项卡传递到其他选项卡。
tabsAll html
<ion-tabs color="primary">
<ion-tab [root]="tab1Root" [rootParams]="{rutValue: rut}"></ion-tab>
<ion-tab [root]="tab2Root" [rootParams]="{rutValue: rut}" ></ion-tab>
</ion-tabs>
tab1Root js
constructor(..., private navParams : NavParams){
var rut = navParams.get("rutValue");
}
更多关于 rootParams
的文档:https://ionicframework.com/docs/api/components/tabs/Tab/
如果这是你想要的,请告诉我。
如果您不想转到您通过创建提供程序将数据发送到共享服务的页面,并在任何您想要的地方获取数据
使用 cli 命令创建提供程序,
ionic g provider providerName
像这样将你的值存储在你的 provider.ts 中,
import { Injectable } from '@angular/core';
@Injectable()
export class Provider {
public addedItems:any;
constructor() {
}
addedItems(data) {
return this.addedItems=data;
}
}
并将此提供程序导入您的 component.ts 以检索附加值。这样您就可以在不打开任何页面的情况下将数据发送到其他页面。希望有帮助
我正在使用 ionic 2 框架,我需要将参数从我的选项卡发送到其他页面,该页面不在我的选项卡上...
我知道方法“this.navCtrl.push(view,{parameters})”但是我只需要发送参数,不想打开其他页面,只有参数。请帮助我。
在我的代码中,我需要发送参数 "rut"。
tabs.html:
<ion-menu [content]="content" >
<ion-header>
<ion-toolbar>
<img class="avatar" src="assets/img/i2.png">
<div class="name-user">{{nombre}} {{apellido}}</div>
<div class="rut-user">{{rut}}</div>
</ion-toolbar>
</ion-header>
<ion-content >
<ion-list>
<div class="items-menu">
<div class="item-menu" (click)="scan()">
<ion-icon name="md-qr-scanner"></ion-icon>
<div class="title">Escanear Producto</div>
</div>
<div class="item-menu" (click)="modificarPerfil()">
<ion-icon name="md-person"></ion-icon>
<div class="title">Perfil</div>
</div>
<div class="item-menu">
<ion-icon name="md-settings"></ion-icon>
<div class="title">Opciones</div>
</div>
<div class="item-menu">
<ion-icon name="md-information-circle"></ion-icon>
<div class="title">Acerca De</div>
</div>
<div class="item-menu" (click)="cerrarsesion()" >
<ion-icon name="md-log-out"></ion-icon>
<div class="title">Cerrar Sesion</div>
</div>
</div>
</ion-list>
</ion-content>
</ion-menu>
<ion-nav [root]="rootPage" #content swipeBackEnabled="true" ></ion-nav>
<ion-tabs color="primary">
<ion-tab [root]="tab1Root" tabTitle="Home" tabIcon="home"></ion-tab>
<ion-tab [root]="tab2Root" tabTitle="Carro" tabBadge="{{num}}" tabIcon="cart" tabBadgeStyle="danger" ></ion-tab>
<ion-tab tabTitle="Perfil" tabIcon="md-person" (ionSelect)="modificarPerfil()"></ion-tab>
</ion-tabs>
我假设您有 3 个页面:tabsAll, tab1Root, tab2Root
其中 tabsAll
是整体,显示了其代码。
您需要将选项卡中的参数发送到其他页面。我假设其他页面是其他选项卡?您可以使用 rootParams
将参数从选项卡传递到其他选项卡。
tabsAll html
<ion-tabs color="primary">
<ion-tab [root]="tab1Root" [rootParams]="{rutValue: rut}"></ion-tab>
<ion-tab [root]="tab2Root" [rootParams]="{rutValue: rut}" ></ion-tab>
</ion-tabs>
tab1Root js
constructor(..., private navParams : NavParams){
var rut = navParams.get("rutValue");
}
更多关于 rootParams
的文档:https://ionicframework.com/docs/api/components/tabs/Tab/
如果这是你想要的,请告诉我。
如果您不想转到您通过创建提供程序将数据发送到共享服务的页面,并在任何您想要的地方获取数据
使用 cli 命令创建提供程序,
ionic g provider providerName
像这样将你的值存储在你的 provider.ts 中,
import { Injectable } from '@angular/core';
@Injectable()
export class Provider {
public addedItems:any;
constructor() {
}
addedItems(data) {
return this.addedItems=data;
}
}
并将此提供程序导入您的 component.ts 以检索附加值。这样您就可以在不打开任何页面的情况下将数据发送到其他页面。希望有帮助