Stack Overflow Asked by Juan Esteban Rios Gonzalez on January 5, 2022
I am displaying a table of products in my Angular project, it displays just fine but the link which I want in the format /admin/products/key doesnt work. I have come to the conclussion that the p.$key
isnt showing the key:
<table class="table">
<thead>
<th>Title</th>
<th>Price</th>
<th></th>
</thead>
<tbody>
<tr *ngFor="let p of products$ | async">
<td>{{ p.title }}</td>
<td>{{ p.price }}</td>
<td>
<a [routerLink]="['/admin/products/', p.$key]">Edit</a>
</td>
</tr>
</tbody>
</table>
p.$key value is undefined, does someone knows how to fix it?
Ps: If anyone needs to know the value of products$
, it is equal to this.products$ = this.productService.getAll().valueChanges();
Add the idField property inside of valueChanges like this:
this.productService.getAll().valueChanges({idField: '$key'});
Then the firebase id will be available within your object like this:
p.$key
Also, consider using the json pipe like {{ p | json }}
for development and you can see all of the values in the object in your browser.
Answered by Ben Bradshaw on January 5, 2022
2 Asked on January 3, 2022 by d-park
1 Asked on January 3, 2022 by steffen-brown
1 Asked on January 3, 2022 by reinaldo-ep
1 Asked on January 3, 2022
1 Asked on January 3, 2022
0 Asked on January 3, 2022 by nicole-ganung
1 Asked on January 1, 2022 by chan-myae-tun
1 Asked on January 1, 2022
3 Asked on January 1, 2022 by david-weisskopf
1 Asked on January 1, 2022
artificial intelligence keras neural network python tensorflow
2 Asked on January 1, 2022 by a2441918
3 Asked on January 1, 2022 by barnee
1 Asked on January 1, 2022 by araf-hasan
2 Asked on January 1, 2022 by ela-urbain
2 Asked on January 1, 2022 by aww
Get help from others!
Recent Answers
Recent Questions
© 2023 AnswerBun.com. All rights reserved. Sites we Love: PCI Database, UKBizDB, Menu Kuliner, Sharing RPP