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 에서 멤버 이벤트 오류를 수정하려면 어떻게 해야합니까?

Events@ionic/angularIonic 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

이벤트가 제거되었습니다. Observable을 사용하여 자체 서비스를 이벤트로 수행하고 ovserable에 게시하고 값을 얻기 위해 구독 할 수있는 주제 동작을 수행 할 수 있습니다.