Я новичок в angular и firebase. Я следую руководству Mo sh по созданию oshop с использованием angular. Я застрял на странице продуктов администратора, где я не могу получить список продуктов и отобразить его на странице продуктов администратора. Я использую Angular6.
admin-products.component.ts
export class AdminProductsComponent implements OnInit {
products$;
constructor(
private productService: ProductService) {
this.products$ = this.productService.getAll();
}
ngOnInit(): void {
}
}
product.service.ts
export class ProductService {
constructor(private db:AngularFireDatabase) { }
create(product){
this.db.list('/product').push(product);
}
getAll() {
return this.db.list('/products').snapshotChanges()
.pipe(
map(productDb =>
{ productDb.map ( prod => {
return {
key: prod.key,
data: prod.payload.val()
}
})}
)
)
}
/* *I also tried below options but nothing works for me.*
getAll(){
return this.db.list('/products').snapshotChanges();
}
getAll(){
return this.db
.list('/products') /*reference => reference.orderByChild('name'))
.snapshotChanges() // include snapshot itself (access to key property)
.pipe(map(metadata => metadata.map(data => ({ key: data.payload.key, data: data.payload.val() }))));
}
getAll(){
return this.db.list('/products').valueChanges();
}*/
}
admin-products.component. html
<tbody>
<tr *ngFor="let p of products$ ">
<td> {{ p.key }} </td>
<td> {{ p.data }} </td>
<td>
<a [routerLink]="['/admin/products/', p.key]">Edit</a>
</td>
</tr>
</tbody>
На странице admin-product я вижу пустую таблицу с заголовком.
Пожалуйста, предложите.