Ionic 4事件在设备中不能工作,但在浏览器上可以工作。

问题描述 投票:0回答:1

我用的是 "@ionic/angular": "^4.11.10"

我正试图在 ion-tabsion-tab-bar 取决于是否有事件发出。我有一个 *ngIf 用于有条件的渲染。这是代码。

<ion-tabs color="danger">
    <ion-tab-bar class="tab-bar" slot="bottom">
        <ion-tab-button *ngIf="!registerClicked" tab="tab1">
            <ion-icon name="thumbs-up"></ion-icon>
            <ion-label>{{'Transfer' | translate}}</ion-label>
        </ion-tab-button>

        <ion-tab-button tab="tab2">
            <ion-icon name="gift"></ion-icon>
            <ion-label>{{'Perks' | translate}}</ion-label>
        </ion-tab-button>
    </ion-tab-bar>
<ion-tabs>

这是事件发射器

import { Events } from '@ionic/angular';
export class LoginModalPage 
  constructor(
      public event:Events
    ) { }

  public login() {
      this.event.publish('registerClicked', false);
  }
}

同样,还有一个函数将registerClicked设置为true:

import { Events } from '@ionic/angular';
export class RegisterModalPage 
  constructor(
      public event:Events
    ) { }

  public register() {
      this.event.publish('registerClicked', true);
  }
}

而在标签后面的代码中:

import { Events } from '@ionic/angular';
export class TabsPage {
  public registerClicked:boolean;
  constructor(
    public event: Events
  ) {
    this.event.subscribe('registerClicked', (data) =>{
      this.registerClicked = data;
    });
  }
}

现在,当我运行localhost:4200时,这段代码就像预期的那样工作了。tab1 在点击按钮时调用登录功能时显示,而当我点击按钮执行 register() 功能。然而,当我建立一个apk,并在设备上测试时,这并不工作。有谁能提供解决这个问题的方法吗?

javascript angular ionic-framework ionic4
1个回答
1
投票

为了更新数据从一个页面到另一个页面,我们使用了事件库,但事件在ionic 5中不再可用。

ionic generate service events        // this will create events provider

复制粘贴blow代码.

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

@Injectable({
  providedIn: 'root'
})
export class EventsService {

private fooSubject = new Subject<any>();

constructor() { }


    publishLogin(data: any) {
        this.fooSubject.next(data);
    }

    receiveLogin(): Subject<any> {
        return this.fooSubject;
    }
}

从A页:导入你的服务在构造函数中初始化它/。

constructor(public events: EventsService){}

并发布事件,例如

 this.events.publishLogin(yourDataVariable);

在B页中接收:导入你的服务在构造函数中初始化它/。

    constructor(public events: EventsService){}

this.events.receiveLogin().subscribe((res:any)=>{
        console.log(res);
      })
© www.soinside.com 2019 - 2024. All rights reserved.