Finished bodies

This commit is contained in:
Jim Martens 2021-09-21 18:57:39 +02:00
parent 0044bebe2f
commit 9f14ad8e5a
3 changed files with 17 additions and 5 deletions

View File

@ -7,8 +7,10 @@
</thead>
<tbody>
<tr *ngFor="let body of bodies | async">
<td>{{body.name}}</td>
<td><span class="bi bi-x-lg"></span></td>
<td>{{body.payload.val()?.name}}</td>
<td><button class="btn btn-outline-danger" type="button" (click)="deleteBody(body.key)">
<span class="bi bi-trash"></span>
</button></td>
</tr>
</tbody>
</table>

View File

@ -0,0 +1,3 @@
td {
vertical-align: middle;
}

View File

@ -1,5 +1,5 @@
import {Component, OnInit} from '@angular/core';
import {AngularFireDatabase} from '@angular/fire/compat/database';
import {AngularFireDatabase, SnapshotAction} from '@angular/fire/compat/database';
import {Observable} from 'rxjs';
import {Body} from './body';
@ -9,17 +9,24 @@ import {Body} from './body';
styleUrls: ['./bodies.component.scss']
})
export class BodiesComponent implements OnInit {
public bodies: Observable<Body[]> = new Observable<Body[]>();
public bodies: Observable<SnapshotAction<Body>[]> = new Observable<SnapshotAction<Body>[]>();
constructor(private database: AngularFireDatabase) { }
ngOnInit(): void {
const bodyRef = this.database.list<Body>('bodies')
this.bodies = bodyRef.valueChanges();
this.bodies = bodyRef.snapshotChanges();
}
public addBody(newBody: string): void {
const bodyRef = this.database.list<Body>('bodies');
bodyRef.push({name: newBody});
}
public deleteBody(bodyKey: string|null): void {
const bodyRef = this.database.list<Body>('bodies');
if (bodyKey != null) {
bodyRef.remove(bodyKey);
}
}
}