rxjs поведенческие темы не меняются Ionic 4 view - PullRequest
0 голосов
/ 23 апреля 2019

Я создаю программу списка, используя Ionic4, и я пытаюсь обновить список, используя BehaviorSubject из rxjs. Список, доступный для обновления во время ngOnInit (), но список не будет обновляться при обратном вызове add ().

Я пытаюсь зарегистрировать вывод, и метод подписки работает (когда я нажимаю добавить, вызывается подписка), но ionic ui не будет обновлять данные. вот мой код:

устройство-management.service.ts

export class DeviceManagementService {

  devices = new BehaviorSubject([]);

  constructor(
    private storage : Storage
  ) { }

  list() {
    this.storage.get('device-list')
      .then( d => {
        if(d==null) this.devices.next([]);
        else this.devices.next(d);
      })
      .catch(e => { console.log(e) });
  }

  save(){
    console.log("saving to storage",this.devices.value);
    this.storage.set('device-list',this.devices.value);
  }

  add(device){
    let x = [].concat(this.devices.value);
    x.unshift(device);
    this.devices.next(x)
    this.save();
  }

  ...

page.ts

  ...

  data = [];

  ngOnInit() {
    if(!this.auth.loginStatus.logged.value) this.router.navigateByUrl('/');
    this.devices.list();
    this.devices.devices.subscribe( devices => {
      this.data = devices;
      console.log("this.data",this.data);   // here i log the subscribe.
      // it also calls on addBtn() , but Ionic View not updating.
    });
  }

  ngOnDestroy() {
    this.devices.devices.unsubscribe();
  }

  addBtn() {
    this.devices.add( { id:1 , nama:"test" } );
  }

  ...

page.html

...
<ion-item *ngFor="let d of data">
  <ion-label>
    <h1>{{d.nama}}</h1>
    <h2>{{d.id}}</h2>
  </ion-label>
  <ion-icon name="settings" slot="end" (click)="presentActionSheet()">
  </ion-icon>
</ion-item>
<ion-button expand="block" (click)="addBtn()">
  <ion-icon name="add-circle-outline"></ion-icon>
  add device
</ion-button>
...

где я могу сделать что-то не так, чтобы мой просмотр ionic4 не обновлялся?


решено: я перезагружаю свою ионную подачу, и она просто работает.

Ответы [ 2 ]

1 голос
/ 23 апреля 2019

Попробуйте поместить этот код в метод конструктора:

import {Subscription} from 'rxjs';
subscription: Subscription; // this is a local variable

..........

this.devices.list();
    this.subscription = this.devices.devices.subscribe( devices => {
      this.data = devices;
      console.log("this.data",this.data);   // here i log the subscribe.
      // it also calls on addBtn() , but Ionic View not updating.
    });

Что показывают журналы вашего приложения?

0 голосов
/ 24 апреля 2019

Попробуйте изменить массив data = [] на массив с предопределенными свойствами name и id.Например, вы можете создать:

export class Example {
  nama: string;
  id: string;
}

, а затем сделать:

data: Example [];
...