仅将参数从选项卡发送到其他页面 - Ionic2

时间:2017-06-30 03:38:19

标签: php parameters tabs ionic2 send

我正在使用framework 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>

2 个答案:

答案 0 :(得分:1)

我假设您有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/

如果这是您想要的,请告诉我。

答案 1 :(得分:0)

如果您不想转到该页面,可以通过创建提供商将数据发送到共享服务并在任何地方获取数据

使用cli命令

创建提供程序
ionic g provider providerName

将您的价值存储在您的提供商中。像这样,

import { Injectable } from '@angular/core';

@Injectable()
export class Provider {
  public addedItems:any; 
  constructor() {
  }
  addedItems(data) {
    return this.addedItems=data;
  }
}

并在component.ts中导入此提供程序以检索添加的值。这样,您可以将数据发送到其他页面而无需打开任何页面。希望有所帮助