angular 8 карта не существует для типа '{}' - PullRequest
Новая
       24

angular 8 карта не существует для типа '{}'

1 голос
/ 18 марта 2020

У меня есть простое приложение, которое получает данные из базы данных firebase / firestore.

в методе getAlbums (get all) карта выдает ошибку. (ошибка: 'map' не существует для типа '{}'

list-component.ts: 

import { Component, OnInit } from '@angular/core';
import { map } from 'rxjs/operators';

// Firebase
import { AlbumService } from './../album.service';
import { Album } from './../album.model';

@Component({
  selector: 'app-album-list',
  templateUrl: './album-list.component.html',
  styleUrls: ['./album-list.component.scss']
})
export class AlbumListComponent implements OnInit {
  albums: Album[];

  constructor(
    private albumService:AlbumService
  ) { }

  ngOnInit(): void {
    this.getAlbums();
  }

  getAlbums() {
    this.albumService.getAlbums().subscribe(data => {
      this.albums = data.map(a => {
        return {
          id: a.payload.doc.id,
          ...a.payload.doc.data()
        } as Album;
      })
    });
  }
}

app-module.ts 

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';

// Firebase
import { AngularFireModule } from '@angular/fire';
import { AngularFireDatabaseModule } from '@angular/fire/database';
import { environment } from './../environments/environment';
import { AlbumListComponent } from './albums/album-list/album-list.component';
import { CommonModule } from "@angular/common";


@NgModule({
  declarations: [
    AppComponent,
    AlbumListComponent
  ],
  imports: [
    BrowserModule,
    CommonModule,
    AppRoutingModule,
    AngularFireModule.initializeApp(environment.firebaseConfig),
    AngularFireDatabaseModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

Уже импортирован опоратор карт (в компоненте списка) и добавлен общий модуль (в модуле приложения)

1 Ответ

1 голос
/ 18 марта 2020

Вы должны проверить, является ли каждый элемент вашего массива нулевым или неопределенным, потому что если вы попытаетесь отобразить нулевой объект, это выдаст вам ошибку. Попробуйте добавить это условие if(!a) return null;

getAlbums() {
    this.albumService.getAlbums().subscribe(data => {
      this.albums = data.map(a => {
        if(!a) return null;
        return {
          id: a.payload.doc.id,
          ...a.payload.doc.data()
        } as Album;
      })
    });
  }
...