как использовать rxjs / angular observable для публикации значения - PullRequest
Новая
       20

как использовать rxjs / angular observable для публикации значения

0 голосов
/ 27 августа 2018

Я слоняюсь с ионным (фреймворк построен на вершине углового), и я немного озадачен паттерном Observable от rxjs.У меня следующая ситуация:

  • Я хочу создать службу, которая содержит обновленный счетчик «в реальном времени», скажем, непрочитанные сообщения.
  • Я хочу, чтобы внешнее влияние изменилосьзначение, скажем, один сигнал получил сообщение

У меня есть что-то вроде следующего кода, но происходит ошибка при подписке в MyApp.Мне трудно найти, как публиковать новые значения из MyApp.Я считаю, что нормальная процедура заключается в использовании функции обратного вызова при создании Observable.

Может ли кто-нибудь указать мне правильное направление?

@Injectable()
export class DataProvider {

  numbers: Observable<number>;


  constructor(public http: HttpClient) {  
    this.numbers = new Observable<number>();
  }

  get_n_messages()
  {
    return this.numbers;
  }  
}



@Component({
  templateUrl: 'app.html'
})
export class MyApp {
  subscription: any;

  constructor(platform: Platform, statusBar: StatusBar, splashScreen: SplashScreen, oneSignal: OneSignal, dataCtrl: DataProvider) {    
    this.subscription = dataCtrl.get_n_messages().subscribe( x => {});
  }  

  private onPushReceived(payload: OSNotificationPayload) {
    alert('Push recevied:' + payload.body);
    this.subscription.next(666);1
  }
}

Ответы [ 2 ]

0 голосов
/ 27 августа 2018

Использование rxjs Тема

Вот пример 

@Injectable()
export class DataProvider {

  numbers: new Subject<number>();

  constructor(public http: HttpClient) {  

  }

}

и .ts 

 @Component({
      templateUrl: 'app.html'
    })
    export class MyApp {


     constructor(platform: Platform, statusBar: StatusBar, splashScreen: SplashScreen, oneSignal: OneSignal, dataCtrl: DataProvider) {  }

     private onPushReceived(payload: OSNotificationPayload) {
        alert('Push recevied:' + payload.body);

          this.dataCtrl.numbers.next(666);
      }

     ngOnInit() {

        this.dataCtrl.numbers.subscribe(res => {
            console.log(res);
        });
     }


}
0 голосов
/ 27 августа 2018

Сделать numbers a BehaviorSubject<number> вместо Observable<number>.BehaviorSubjects можно использовать как в качестве наблюдателя, так и в качестве наблюдаемого.

Поэтому, если вы хотите передать ему новые значения, вы можете вызвать для него метод next и передать новое значение.

Слушатель / подписчик этого BehaviorSubject получит новые значения.

Итак, вот изменения, которые вам нужно будет сделать:

В свой DataProvider 

@Injectable()
export class DataProvider {    
  numbers$: BehaviorSubject<number> = new BehaviorSubject<number>(0);    
}

И для вашего компонента: 

@Component({
  templateUrl: 'app.html'
})
export class MyApp {
  subscription: any;
  newNotificationCount;

  constructor(
    platform: Platform, 
    statusBar: StatusBar, 
    splashScreen: SplashScreen, 
    oneSignal: OneSignal, 
    dataCtrl: DataProvider
  ) {
    this.subscription = this.dataCtrl.numbers$.subscribe(newNotificationCount => this.newNotificationCount = newNotificationCount);
  }

  private onPushReceived(payload: OSNotificationPayload) {
    alert('Push recevied:' + payload.body);
    this.dataCtrl.numbers$.next(666);
  }
}

Хотя, поскольку значение обновляется в том же контроллере, я не думаю, что такая служба DataProvider потребуется.Но если вы хотите, чтобы и где-то в других местах показывалось уведомлениеCount, и хотите, чтобы количество постоянно оставалось неизменным, этого будет достаточно.

...