Провайдер событий устарел. Использование Redux или Observables для состояния в приложениях ioni c - PullRequest
Новая
       27

Провайдер событий устарел. Использование Redux или Observables для состояния в приложениях ioni c

1 голос
/ 16 февраля 2020

Я использую события в моем приложении ioni c, где я подписываюсь на одной странице, и публикую sh событие на другой странице. Теперь я вижу предупреждение о том, что События будут изменены с помощью Observables и состояния и эффекта Redux. Я использовал «События» в основном для вызова изменений функций компонента вне его, поэтому у меня были компоненты, например:

Component1.ts 

this.events.subscribe('event:addValue1', (data: any) => {
this.valueName = 'VALUE1';
});

this.events.subscribe('event:addValue2', (data: any) => {
this.valueName = 'VALUE2';
});

, а за пределами этого компонента я вызывал паблику. sh методов с любой страницы, например:

Page1.ts 

this.events.publish('event:addValue1');

Page2.ts 

this.events.publish('event:addValue2');

Этим я смог изменить данные ( this.valueName) за пределами Component1.ts с любой другой страницы, просто опубликовав нужное событие. Я знаю, что это может показаться неправильным или неправильным подходом, но это был единственный способ, которым я вносил изменения в свой Component1.ts вне его с любой страницы.

Теперь я изменил это и просто поместил отдельные функции и чем я получаю к ним доступ через имя компонента ViewChild, например 

@ViewChild('component') component: any;
....
this.component.functionAddValue1().

, и дополнительно я отправляю дополнительные параметры через Angular NavigationExtras, если мне нужно вычислить и вызвать какую-то функцию из Component1.ts, скажем, если я перейду к какой-то маршрут. До этого я просто вызывал events.publi sh, и я мог вносить изменения в Component1.ts на лету.

1 Ответ

1 голос
/ 16 февраля 2020

Создать службу событий. В EventService.ts: 

    export class EventService {
    private dataObserved = new BehaviorSubject<any>('');
    currentEvent = this.dataObserved.asObservable();
    constructo(){}

    publish(param):void {
      this.dataObserved.next(param);
    }
   }

Для публикации события из примера page1: 

    constructor(public eventService:EventService){}
updatePost(value){
this.eventService.publish({name:'post:updated',params:value});
}

На странице 2: 

constructor(public eventService:EventService){
  eventService.currentEvent.subscribe(value=>{
if(value.name=='post:updated'){
//get value.name
}else if(value.name=='another:event'){
//get value or update view or trigger function or method...
}
 // here you can get the value or do whatever you want

});
}
...