49913

InvalidPipeArgument: '[object Object]' for pipe 'AsyncPipe' Angular 6 and FIreba

Question:

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

I am trying to do unsubscribe the observable

Angular-cli = 6.0.3

<blockquote>

HTML home.component.html

</blockquote> <div class="starter-template">

Firebase Data

<ul> <li *ngFor="let course of courses$ | async"> {{ course.$value }} </li> </ul> </div> <blockquote>

Typescript home.component.ts

</blockquote> export class HomeComponent { courses$; constructor(db: AngularFireDatabase) { this.courses$ = db.list('/course'); } }

Answer1:

The doc (<a href="https://github.com/angular/angularfire2/blob/master/docs/rtdb/lists.md#retrieve-data" rel="nofollow">https://github.com/angular/angularfire2/blob/master/docs/rtdb/lists.md#retrieve-data</a>) says you need to use .valueChanges():

import { Component } from '@angular/core'; import { AngularFireDatabase } from 'angularfire2/database'; import { Observable } from 'rxjs'; @Component({ selector: 'app-root', template: ` <ul> <li *ngFor="let item of items | async"> {{ item | json }} </li> </ul> `, }) export class AppComponent { items: Observable<any[]>; constructor(db: AngularFireDatabase) { this.items = db.list('items').valueChanges(); } }

Recommend

  • SDN4 Config - java.lang.annotation.AnnotationFormatError: Invalid default: …EnableNeo4jRepositories.
  • Bluemix Push Notification service not working anymore?
  • TensorFlow stuck into endless loop using tf.while_loop()
  • Unexpected behavior with exception handling in async, possible bug?
  • Reference.push failed: first argument contains undefined in property 'confirm.orderTotal'
  • Observable.forkJoin() TS2322 error after updating to TypeScript 2.4.1 and Rxjs 5.4.2
  • Incorrect behaviour when selecting chips in Angular Material
  • Cannot update firebase version [duplicate]
  • Firebase firestore cloud functions showing trigger type 'unknown'
  • Firebase, only get new children
  • jinja2 template not found and internal server error
  • What does the TypeScript “lib” option really do?
  • is there a way to update filter with async data
  • New Firebase failed: First argument must be a valid firebase URL and the path can't contain “.”
  • Authentication failed with Azure Active Directory in Windows Phone
  • In loopback documentation what does variable 'cb' stands for?
  • Floated image with variable width and heading with background image
  • ThreadStatic in asynchronous ASP.NET Web API
  • Disable Kendo Autocomplete
  • Django invalid literal for int() with base 10
  • xtable package: Skipping some rows in the output
  • Jetty Server not starting: Unable to establish loopback connection
  • C++ Partial template specialization - design simplification
  • FileReader+canvas image loading problem
  • Insert into database using onclick function
  • Deselecting radio buttons while keeping the View Model in synch
  • Why HTML5 Canvas with a larger size stretch a drawn line?
  • Change an a tag attribute in JavaScript based on screen width
  • Akka Routing: Reply's send to router ends up as dead letters
  • Cannot Parse HTML Data Using Android / JSOUP
  • Java static initializers and reflection
  • embed rChart in Markdown
  • unknown Exception android
  • How to get NHibernate ISession to cache entity not retrieved by primary key
  • Observable and ngFor in Angular 2
  • How to Embed XSL into XML
  • How can I use `wmic` in a Windows PE script?
  • UserPrincipal.Current returns apppool on IIS
  • Unable to use reactive element in my shiny app
  • Conditional In-Line CSS for IE and Others?