Angular2 n - getting invalid argument [object Object] ... for pipe 'AsyncPipe'
Async pipe needs an Observable rather then an Array.
In your case just try to remove async:
<tbody *ngFor="let product of products">Also change variable definition:
public products:Array<Product> = [];Explanation:array | async does subscribe by itself.
The code
this.productService.load().subscribe( data => { // Set the products Array this.products = data['_embedded'].products; },...transforms an Observable to Array of Products
Update: This already works in async manner: since products is an empty array, ngFor doesn't run. When Observable gets a response and populates data into products, a change detection round takes place and goes through ngFor again (now populating products)
Another weird thing I've noticed (I could be wrong):
ngFor very like should be on tr:
<tbody> <tr *ngFor="let product of products | async"> ... </tr></tbody>In this case you'll have multiple rows and just one tbody