javascript - hata TS2559: 'BookInterface[]' türünün 'BookInterface' türü ile ortak hiçbir özelliği yok

Sevgili, Angular 7 ile bir sayfa geliştiriyorum ve bana hata TS2559: Type 'BookInterface[]' has no properties in common with type 'BookInterface' gösteriliyor. Kodu değiştirdim ama yine de çözümü bulamıyorum, kodu aşağıda bırakıyorum, hata getListBooks() metodunda fırlatılıyor: işte dosyam list-books.component.ts

import { BookInterface } from './../../../models/book';
import { DataApiService } from './../../../services/data-api.service';
import { Component, OnInit } from '@angular/core';
import {NgForm} from '@angular/forms';


@Component({
  selector: 'app-list-book',
  templateUrl: './list-book.component.html',
  styleUrls: ['./list-book.component.css']
})
export class ListBookComponent implements OnInit {

  constructor(private dataApi: DataApiService) { }
    private books: BookInterface = {};

  ngOnInit() {
    this.getListBooks();
  }

  getListBooks() {
    this.dataApi.getAllBooks().subscribe(books => {
      this.books  = books;
    });
  }

  onDelete() {
    console.log('LIBRO ELIMINADO');
  }

}

data-api.service.ts dosyamın arayüzü çağırdığım kodunu da bırakıyorum

import { map } from 'rxjs/operators';
import { Observable } from 'rxjs/internal/Observable';
import { Injectable } from '@angular/core';
import { AngularFirestore, AngularFirestoreCollection, AngularFirestoreDocument } from '@angular/fire/firestore';
import { BookInterface } from '../models/book';


@Injectable({
  providedIn: 'root'
})
export class DataApiService {

  constructor(private afs: AngularFirestore) {
    this.bookCollecction = afs.collection<BookInterface>('books');
    this.books = this.bookCollecction.valueChanges();
  }

  private bookCollecction: AngularFirestoreCollection<BookInterface>;
  private books: Observable<BookInterface[]>;
  private bookDoc: AngularFirestoreDocument<BookInterface>;
  private book: Observable<BookInterface>;

  getAllBooks() {
    return this.books = this.bookCollecction.snapshotChanges()
    .pipe(map( changes => {
      return changes.map( action => {
        const data = action.payload.doc.data() as BookInterface;
        data.id = action.payload.doc.id;
        return data;
      });
    }));
  }
  // metodo que trae un libro a traves de su id
  getOneBook(idBook: string) {
    this.bookDoc = this.afs.doc<BookInterface>(`books/${idBook}`);
    return this.book = this.bookDoc.snapshotChanges().pipe(map(action => {
      if (action.payload.exists === false){
        return null;
      } else {
        const data = action.payload.data() as BookInterface;
        data.id = action.payload.id;
        return data;
      }
    }));
  }
  addBook(book: BookInterface): void {
    this.bookCollecction.add(book);
  }
  updateBook(book: BookInterface): void {
    let idBook = book.id;
    this.bookDoc = this.afs.doc<BookInterface>(`books/${idBook}`);
    this.bookDoc.update(book);
  }
  deleteBook(idBook: string): void {
    this.bookDoc = this.afs.doc<BookInterface>(`books/${idBook}`);
    this.bookDoc.delete();
  }
}

Şu anda kullandığım TypeScript sürümü 2.7.2, ancak problemi çözmeden de güncelledim

Cevap #1

Aşağıdakileri değiştirmeniz gerekiyor:

private books: BookInterface = {};

için :

private books: BookInterface[] = [];