Angular2项目中的TSLint错误：无法将类型&#39;Subscription&#39;分配给类型&#39;FirebaseListObservable <any[]> “

Question

Having this issue, can't figure it out...

Here's the relevant code:

export class AdminComponent {
  items: FirebaseListObservable < any[] > ;
  private xyz: string;
  private fbList: FirebaseListObservable < any[] > ;
  private userData: object[];
  private userEid: object[];
  private userFullName: object[];
  private uniqueID: string;
  private quizAnswerA: string;

  private userList = [];
  private userAnswer1: any;

  constructor(db: AngularFireDatabase, private router: Router, private route: ActivatedRoute) {
    this.fbList = db.list('/');

    this.items = this.fbList.map(items => {
      const dbAnalytics = items[0];
      const dbBookings = items[1];
      const dbClasses = items[2];
      const dbLabs = items[3];
      const dbMachines = items[4];
      const dbPostLabs = items[5];
      const dbPreLabs = items[6];
      const dbUsers = items[7];

      for (const key of Object.keys(dbUsers)) {
        if (dbUsers.hasOwnProperty(key)) {
          this.userData = dbUsers[key];
          this.uniqueID = key;
          this.userEid = this.userData['eid'] !== undefined ? this.userData['eid'] : 'N/A';
          this.userFullName = this.userData['name'];

        }
        let time = 'N/A';
        let count = 0;
        let runs = dbAnalytics['expRuns'];
        if ((key in runs)) {
          let experiments = runs[key]['-KVQN-Qk-CLh_KupgKTt'];
          count = Object.keys(experiments)
            .length;
          try {
            time = experiments[Object.keys(experiments)[Object.keys(experiments)
              .length - 1]]['time'].replace('T', '  ')
              .split('.')[0];
          } catch (e) {}

        }

        let firstQuizAnswer = dbPostLabs['-KVQN-Qk-CLh_KupgKTt']['a']['completed'];
        let secondQuizAnswer = dbPostLabs['-KVQN-Qk-CLh_KupgKTt']['b']['completed'];
        let thirdQuizAnswer = dbPostLabs['-KVQN-Qk-CLh_KupgKTt']['c']['completed'];
        let fourthQuizAnswer = dbPostLabs['-KVQN-Qk-CLh_KupgKTt']['d']['completed'];

        let store = new Row(this.userFullName, this.userEid, this.uniqueID, count, time, firstQuizAnswer[key], secondQuizAnswer[key], thirdQuizAnswer[key], fourthQuizAnswer[key]);
        this.userList.push(store);
      }
    }
    );
  }

}

Errors:

TS2322: Type 'Subscription' is not assignable to type 'FirebaseListObservable'. Property '$ref' is missing in type 'Subscription'.

How can I fix these? I'm new to both firebase and angular2. All suggestions are appreciated.

I tried using this (similar) question, but to no avail.

Type 'Subscription' is not assignable to type 'Observable<SearchResult[]>' Angular 5 using HttpClient instead of Http

Thanks!

Answer 1

So following your stackBlitz I believe I have found your issue, without knowing what the data will look like at the end I can tell you what is going on. First of all I suggest separating your logic as in the stackBlitz example, with a service.

Whether you do or don't first of all make fbList into an Observable not a FireBaseObservableList - I believe it is deprecated anyway. I also made items as an empty array of type any too (again I don't know what you want the end result to look like) but in anycase I didn't use the angular | async pipe) and add the .ValueChanges() to the fbList to make it an Observable.

Alternatively if you know what your data will look like and want to use map then you do can declare items as a type of it then if you want to use the map operator, first import it to angular from rxjs/operators and remember you must use .pipe(map()) first. Check out the example and try it without doing all the other stuff first to see it works. If you need more direction on the model please update a sample of the data.

https://angular-rt-database-dmw7gd.stackblitz.io