Как мне обновить значение RxJS Observable, созданного с использованием (myArray) - PullRequest
Новая
       5

Как мне обновить значение RxJS Observable, созданного с использованием (myArray)

0 голосов
/ 20 февраля 2019

У меня возникла проблема при работе с Angular и Observable.

Я получил страницу Basket, подписывающуюся на Observable массива в BasketService, содержащего мои заказы клиентов.Когда я нажимаю на кнопку «Подтвердить», я очищаю свой массив ordersArray, но, несмотря на то, что моя страница корзины подписана на мою наблюдаемую, она не обновляется.

В моем BasketPage.ts 

  ngOnInit() {
this.nourritureSubscription = this.panierService.nourritureStore.subscribe((data) => {
  if(data.length === 0) {
    this.isNourriturePanierEmpty = true;
  } else {
    this.nourriturePanier = data;
    console.log(data)
    this.isNourriturePanierEmpty = false;
  }
});
this.menuSubscription = this.panierService.menuStore.subscribe((data) => {
  if(data.length === 0) {
    this.isMenuPanierEmpty = true;
  } else {
  this.menuPanier = data
  console.log(data)
  this.isMenuPanierEmpty = false;
  }
})
}
consumePanier(){
let commandeSucess : boolean;
this.panierService.consumePanier()
this.commandeEnvoyee();
}
async commandeEnvoyee() {
const alert = await this.alertCtrl.create({
    header: 'Commande envoyée !',
    message: 'Votre commande a été approuvée et enregistrée',
    buttons: [
        {
            text: 'Valider',
            role: 'cancel',
            cssClass: 'primary',
            handler: () => {
              this.ngOnInit();
             }
         }
      ]
 });

 await alert.present();
}

Вmy BasketService.ts 

nourritureArray: Nourriture[] = [];
menuArray: Menu[] = [];

nourritureStore = of(this.nourritureArray)
menuStore = of(this.menuArray)

consumePanier(){
let panierRef = [];
let user=JSON.parse(localStorage.getItem('user'));

panierRef.push({idUser: user.id})

Object.entries(this.nourritureArray).forEach(([key, value])=>{
  panierRef.push({idNourriture: value.id, nameNourriture: value.name})
})
Object.entries(this.menuArray).forEach(([key, value])=>{
  panierRef.push({idMenu: value.id, nameMenu: value.name})
})

let commande = JSON.parse(JSON.stringify(panierRef));

panierRef= [];

this.nourritureArray = [];
this.menuArray = [];
}

Кто-нибудь еще?

Подсказки: -При перезагрузке URL-адреса у меня есть обновленное хранилище (но я не могу принудительно перезагрузить с маршрутизатором, не знаюпочему ...) -Когда я обновляюсь с помощью ngOnInit, я получаю старое значение из наблюдаемого, даже если мой массив пуст ...

1 Ответ

0 голосов
/ 27 февраля 2019

Метод of просто создает Observable, который выдаст заданные аргументы и затем завершится.Он не будет отслеживать любые изменения, которые вы вносите в аргументы после факта.
Возможно, вы захотите взглянуть на использование Subject .Субъект действует как Observer и Observable, что позволяет передавать данные подписчикам субъектов.В вашем случае эти данные будут массивами вашего магазина.Вместо создания Observables из буквального значения, создайте их из темы, которую вы можете обновлять при изменении значения.
Вот супер упрощенный пример для одного массива, который выполняет то, что, я думаю, вы ищете: 

export class BasketService {

  // Create a new BehaviorSubject with an initial value of []
  private Subject<Menu[]> menuSubject = new BehaviorSubject<>([]);

  // Expose the menuSubject as an Observable (prevents consumers from pushing values)
  Observable<Menu[]> menuStore = menuSubject.asObservable();

  public addMenuItem(menuItem: Menu) {
    // Get the current value of the menu store
    const menus = this.menuSubject.getValue();
    // Add the new menu 
    menus.push(menuItem);
    // Push the updated menu to the subject
    this.menuSubject.next(menus); // This is what notifies subscribers
  }

  public consumePanier() {

    /// ... your business logic

    // Update the value of the subject with an empty array
    this.menuSubject.next([]); // This is what notifies subscribers
  }  
}

Важно отметить, что в этом примере каждый раз, когда вы вносите изменения в данные, вы должны отправить новые данные субъекту с помощью метода next, чтобы подписчики были уведомлены.

...