Как обновить пользовательский интерфейс после обещания в сервисе вернул объект из базы данных - PullRequest
Новая
       22

Как обновить пользовательский интерфейс после обещания в сервисе вернул объект из базы данных

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

Я хочу загрузить объект из indexed-db и заполнить мою форму с этими данными в пользовательском интерфейсе.Я использую этот метод в службе, и мой компонент вызывает службу на ngOnInit().Как мой компонент узнает, доступны ли данные?

service.ts 

 private loadFromInMemory(): IConfigEntity {
    this.db.getByKey(this.dbStoreName, 1).then(
      dbContent => {
        console.log(dbContent);
      },
      error => {
        console.log(error);
      }
    );

   return null;
}

component.ts 

 ngOnInit() {
    const config = this.configService.load();
    this.testValue = config.test;
    this.test2Value = config.test2;

  }

Ответы [ 2 ]

2 голосов
/ 29 апреля 2019

Использование rxJs для состояния управления:

в package.json 

"rxjs": "6.2.1",

в обслуживании: 

import {BehaviorSubject} from 'rxjs/BehaviorSubject';

public onDataChanged: BehaviorSubject<any> = new BehaviorSubject([]);

private loadFromInMemory(): IConfigEntity {
    this.db.getByKey(this.dbStoreName, 1).then(
      dbContent => {
        this.onDataChanged.next(dbContent);
      },
      error => {
        console.log(error);
      }
    );

   return null;
}

в компоненте: 

import {Subscription} from 'rxjs/Subscription';

private onDataChanged: Subscription;

ngOnInit() {
    this.onUsersListChanged = 
       this.sharedService.onUsersListChanged.subscribe(data => {
         cosnole.log(data) // access to shared data :)
    })
}

public ngOnInit() {
    // Do not forget to unsubscribe the subscription
    this.onDataChanged.unsubscribe();
}
0 голосов
/ 29 апреля 2019

В вашу службу возврата 

loadFromInMemory(storename, id) {
    return this.db.getByKey(storename, id);
}

Затем в вашем файле компонента вызовите сервисную функцию 

constructor (private myservice: ServiceName){}
this.myservice.loadFromInMemory(storename, id).subcribe(
      dbContent => {
        console.log(dbContent);
      },
      error => {
        console.log(error);
      }
    );
...