AngularFireDatabase remove object

Angular
1

I am on project project management in the Angular course.
I am stumped on this.

In my ProductService I can remove an object from the Realtime database as long as I call it from the constructor, but if I call remove from my delete function (see below) the object does not delete from the database. Anyone ever run into this?

export class ProductService {

itemsRef: AngularFireList<any>;
items: Observable<any[]>;

// this works from the constructor
constructor(private db: AngularFireDatabase) {
this.itemsRef = db.list(’/products’);
// Use snapshotChanges().map() to store the key
this.items = this.itemsRef.snapshotChanges().pipe(
map(changes =>
changes.map(c => ({ key: c.payload.key, …c.payload.val() }))
)
);
db.object(’/products/-MQ-WK-e1GUtxLPhGBfM’).remove()
}
/* does not work */
delete(productId) {
console.log(‘products/’ + productId);
this.db.object(’/products/-MQ-WK-e1GUtxLPhGBfM’).remove()
.catch(error => console.log(error));
}

2

Discovered the problem. My update function was getting called right after the delete button was selected. My bug.

3

It turns out that a button is type=“submit” by default. So the delete button called my delete function and then submitted the form. So it deleted the object and then put in right back. Moral is
give a button type=“button” unless you want the form to submit on click

1 Like