具有Angular observables

时间:2017-06-25 19:46:25

标签: javascript angular firebase nativescript nativescript-angular

遇到此问题时,我试图获取Firebase数据库的一些数据: 从第一条路径获取数据(例如:userData / tags)一切都很完美, 但当我调用另一个函数从第二个路径获取数据时(例如:userData / tasks)没有任何作用,在我的控制台中没有任何错误,也没有记录任何监听器。我认为这是我的代码错误或firebase问题,但后来我发现了一个有趣的故事。

我使用此代码从我的数据库中获取数据,并在服务类中并置。

  @Injectable()
        export class Database{
        private allData: any;
        constructor(){}
            public getList(path: string): Observable<any> {
                  return new Observable((observer: any) => {
                  let onValueEvent = (snapshot: any) => {
                    this.ngZone.run(() => {
                      let results = this.handleSnapshot(snapshot.value);
                      console.dir(results);
                      observer.next(results);
                    });
                  };
                  firebase.addValueEventListener(onValueEvent, `/${path}`).then((msg)=>{console.dir(msg)}).catch((error)=>{console.error(error);});
                }).share();
              }

        private handleSnapshot(data: any) {
        //empty array, then refill and filter
        this.allData = [];
        if (data) {
          for (let key in data) {
            let result = (<any>Object).assign({ key: key }, data[key]);
            this.allData.push(result);
          }
        }
        return this.allData;
      }
        }

使用UI界面从名为A的组件页面调用我的代码,一切正常。 我创建了一个名为B的新组件,目前只有没有UI的后端代码:没有任何工作,正如我之前所说。

当我突然添加UI部分时,一切正常!

A&amp; A的组件页码B: page.ts(A&amp; B)

export class Page{
    public data$;
    constructor(db: Database){
      this.data$ = this.db.getList();
    }
  }

page.html(仅限A)

 <ListView [items]="data$ | async">
    <ng-template let-item="item">
        <StackLayout>
        <Label [text]='item.title'></Label>
        </StackLayout>
    </ng-template>
</ListView>

顺便说一下,在查询数据库时也会发生这种情况。

我不能说这与Nativescript,Firebase,Angular有关,还是与我的架构有关。最糟糕的是混合后端和前端,通常是两个不同的开发人员构建这两个部分。

0 个答案:

没有答案