Как исправить событие участника от @ ионной / угловой ошибки в Ionic 5

9

Я обновился с Ionic 4 до Ionic 5, теперь получаю следующую ошибку:

ОШИБКА в файле src / app / app.component.ts (4,10): ошибка TS2305: Модуль '"/ node_modules / @ ionic / angular / ionic-angular" не имеет экспортированного элемента «События».

Следующая строка импорта вызывает проблему:

import { Events, Platform } from '@ionic/angular';

Как я могу исправить событие участника от @ionic/angularошибки в Ionic 5?

Мухаммед Омаис
источник
Привет, я сталкиваюсь с той же проблемой. И мне кажется, что Ionic 4 удалил события. Я нашел это: stackoverflow.com/questions/58265379/… Может быть, это помогает
Ipad
1
у меня та же ошибка, я также был бы рад найти простую замену для этого. Не хочу идти за редуксом в моем случае.
Фарго
Я тоже получаю это. Это похоже на масштабное прорывное изменение. Было ли это когда-либо задокументировано командой Ionic? Если так, я хотел бы прочитать это!
Джон,
@ IPad, пожалуйста, проверьте мой ответ.
Шашанк Агравал
@ Джон, это задокументировано в документации по изменениям Ionic. Пожалуйста, проверьте мой ответ.
Шашанк Агравал

Ответы:

15

EventsИз @ionic/angularпакета был удален из Ionic 5. Вы можете увидеть последние изменения в Ionic5 здесь .

Как уже упоминалось в критических изменениях, вы должны использовать Observables.

Например, вы можете создать следующий сервис:

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

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

    private fooSubject = new Subject<any>();

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

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

Теперь вы можете подписаться на любой компонент, например app.component.ts:

@Component({
    selector: 'app-root',
    templateUrl: 'app.component.html',
    styleUrls: ['app.component.scss']
})
export class AppComponent {

    constructor(private globalFooService: GlobalFooService) {
        this.initializeApp();
    }

    initializeApp() {
        // other code

        this.globalFooService.getObservable().subscribe((data) => {
            console.log('Data received', data);
        });
    }
}

Теперь вам просто нужно отправить событие из какого-то другого компонента:

@Component({
    selector: 'app-home',
    templateUrl: 'home.page.html',
    styleUrls: ['home.page.scss']
})
export class HomePage {

    constructor(private globalFooService: GlobalFooService) {
    }

    onSomeButtonClick() {
        this.globalFooService.publishSomeData({
            foo: 'bar'
        });
    }
}

Это очень простое решение / пример или альтернатива, Eventsно вы можете настроить свой код дальше, чтобы сделать его пространственным событием с темой.

Я написал блог на эту тему, который может дать вам полнофункциональное решение, чтобы с минимальным изменением кода вы могли обновить свое приложение.

https://medium.com/wizpanda/dealing-with-breaking-change-in-ionic-5-db3ba711dfcd

Шашанк Агравал
источник
0

События были удалены. Вы можете сделать свой собственный сервис как событие как свой собственный, используя observables и подчиненное поведение, чтобы вы могли опубликовать в ovserable и подписаться, чтобы получить значение.

Мостафа Харб
источник