如何检索angularfire集合并显示在html上

Question

我试图在HTML页面中显示我添加到集合中的所有客户。我无法显示收藏夹列表。

我该怎么做才能解决此问题？

我的firebaseService.ts：

addcustomer(value){
    return new Promise<any>((resolve, reject) => {
        let currentUser = firebase.auth().currentUser;  

        this.afs.collection('customers').doc(currentUser.uid).collection('info').add({
            name: value.name,
            address: value.address, 
            description: value.description, 
            id: value.id
        })

        .then(
            res => resolve(res),
            err => reject(err)
        )
    })
}

getcustomers(){
    return new Promise<any>((resolve, reject) => {
        let currentUser = firebase.auth().currentUser;
        this.snapshotChangesSubscription = this.afs.collection('customers').snapshotChanges()
        .subscribe(snapshots => {
            resolve(snapshots);
        })
    });
}          

我的home.ts：

import { Component } from '@angular/core';
import { IonicPage, ModalController, NavController, NavParams } from 'ionic-angular';

import { FirebaseService } from '../services/firebase.service';


@IonicPage()
@Component({
    selector: 'page-home',
    templateUrl: 'home.html',
})

export class HomePage {
    items: Array<any> = [];

    items2: Array<any>;

    ionViewWillLoad(){
    this.getData();
  }

getData() {
    this.firebaseService.getcustomers()
    .then(tasks => {
        this.items = tasks;

        console.log(this.items);
    })
}

我的home.html

<ion-header>
    <ion-navbar>
        <ion-title>home</ion-title>
    </ion-navbar>
</ion-header>

<ion-list>
    <ion-item *ngFor="let item of items" >
        <h2>Nombre:{{item.payload.doc.data().name}}</h2>
            {{(item | async)?.payload.doc.data().address}}
            {{(item | async)?.payload.doc.data().description}}
    </ion-item>
</ion-list>