如何从 Ionic 5 中的@ionic/angular 错误修复成员事件 [英] How to fix member Event from @ionic/angular error in Ionic 5
问题描述
我已从 Ionic 4 升级到 Ionic 5,现在出现以下错误:
I have upgraded from Ionic 4 to Ionic 5, now getting following error:
src/app/app.component.ts(4,10) 中的错误:错误 TS2305:模块 '"/node_modules/@ionic/angular/ionic-angular"' 没有导出成员 'Events'.
ERROR in src/app/app.component.ts(4,10): error TS2305: Module '"/node_modules/@ionic/angular/ionic-angular"' has no exported member 'Events'.
以下导入行导致问题:
import { Events, Platform } from '@ionic/angular';
如何修复 Ionic 5 中 @ionic/angular
错误中的成员事件?
How can I fix member Event from @ionic/angular
error in Ionic 5?
推荐答案
Events
来自 @ionic/angular
包已从 Ionic 5 中删除.您可以看到重大更改在 Ionic5 这里.
Events
from @ionic/angular
package got removed from Ionic 5. You can see the breaking changes in Ionic5 here.
正如在重大更改中提到的,您应该使用 Observables
.
As it's mentioned in the breaking changes, you should use Observables
.
例如,您可以创建以下服务:
For example, you can create the following service:
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
:
Now, you can subscribe in any component like 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);
});
}
}
现在,您只需从其他组件发出事件:
Now, you just have to emit the event from some other component:
@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
的替代方案,但您可以进一步调整代码以使其成为具有主题的命名空间事件.
This is a very simple solution/example or alternative of the Events
but you can tweak your code further to make it a namespaced event with a topic.
我写了一篇关于此的博客,它可以为您提供功能齐全的解决方案,这样您只需更改很少的代码即可升级您的应用.
I have written a blog on this which can give you a full-featured solution so that with very less code change, you can upgrade your app.
https://medium.com/wizpanda/处理 ionic-5-db3ba711dfcd
这篇关于如何从 Ionic 5 中的@ionic/angular 错误修复成员事件的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!