Ionic 5で@ ionic / angularエラーからメンバーイベントを修正する方法

Ionic 4からIonic 5にアップグレードしたら、次のエラーが発生します。

src / app / app.component.ts（4,10）のエラー：エラーTS2305：モジュール '"/ node_modules / @ ionic / angular / ionic-angular"'にはエクスポートされたメンバー 'Events'がありません。

次のインポート行が問題の原因です。

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

@ionic/angularIonic 5のエラーからメンバーイベントを修正するにはどうすればよいですか？

angular ionic-framework ionic5

— ムハンマドオマイス
ソース

こんにちは、私は同じ問題に直面しています。そして私にとって、Ionic 4はイベントを削除したようです。私はこれを見つけました： stackoverflow.com/questions/58265379/…多分これは役立ちます

— Ipad

私は同じエラーを抱えていますが、その代わりの簡単な代替品を見つけてもらえれば幸いです。私の場合、還元に行きたくない。

— Fargho

私もこれを手に入れています。これは大規模で重大な変更のようです。これはIonicチームによって文書化されたことがありますか？もしそうなら、それを読みたいです！

— ジョン

@iPadは私の答えを確認してください。

— Shashank Agrawal

@Johnは、Ionicの重大な変更に関するドキュメントに記載されています。私の答えを確認してください。

— Shashank Agrawal

回答:

Events@ionic/angularパッケージがイオン性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

— Shashank Agrawal
ソース

イベントは削除されました。オブザーバブルとサブジェクトの動作を使用して、独自のサービスを独自のイベントとして実行できるため、ovserableにパブリッシュしてサブスクライブして値を取得できます。

— モスタファハーブ
ソース