Как отобразить вложенный список списков с AngularFire2 - PullRequest
0 голосов
/ 18 февраля 2019

Я пытаюсь отобразить список «станций», и внутри каждой «станции» возвращается список «проектов», находящихся в данный момент на этой «станции».Используя angularfire2 snapshotChanges, я могу легко получить список станций вместе с соответствующими метаданными.Затем я получаю «stationName» и использую его в другом запросе, чтобы получить проекты, связанные с этой станцией.Затем во вложенных циклах ngFor я отображаю станции и, в идеале, связанные с ними проекты, однако они не отображаются, и я не уверен, почему.В консоли я вижу проекты, связанные с их извлечением из цикла.Я думаю, что упускаю что-то очевидное, любая помощь была бы отличной.

желаемый эффект:

station 1
 - project 1, project 3, project 5

station 2
 - project 2, project 6

station 3
 - project 4, project 7, project 8

etc.

запросы к пожарному хранилищу:

    this.shopsCollection = afs.collection('stations', ref => ref.orderBy('StationtName'));
    this.shops = this.shopsCollection.snapshotChanges().pipe(
      map(actions => actions.map(a => {
        const data = a.payload.doc.data() as Shop;
        const id = a.payload.doc.id;

        this.queues = this.afs.collection('projects', ref => ref.where('station', '==', data.StationtName)).valueChanges().subscribe(data=>{
          console.log(data);
         })
console.log(data.StationtName);
        return { id, ...data };
      }))

    );

html:

<ul>
    <li *ngFor="let shop of shops | async">
       <ion-button>{{shop.StationtName}}</ion-button>

            <div *ngFor="let queue of queues | async">
                 {{queue.SKU}}
            </div>  

    </li>
</ul> 

эта конкретная установка приводит к следующей ошибке:

Error: InvalidPipeArgument: '[object Object]' for pipe 'AsyncPipe'

любая помощь с благодарностью.Спасибо

1 Ответ

0 голосов
/ 18 февраля 2019

попробуйте удалить |асинхронный канал в наблюдаемой очереди, так как вы уже подписываетесь в компоненте, вам не нужно делать это в шаблоне.

HTH

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...