How to delete a sub collection item in Google Cloud Firestore

Question

I' am working on an angular project with Google Cloud Firestore. Then I have a question. How delete a sub collection item. For Example I want to delete address in follow. I'm using the ng2-smart-table as my table. I had added it into manufacture component.

manufacture.service.ts

import { Injectable } from '@angular/core';
import { Manufacture } from './manufacture.model';
import { AngularFirestore } from '@angular/fire/firestore';
import { from } from 'rxjs';

@Injectable({
providedIn: 'root'
})
export class ManufactureService {
    manufacture: Manufacture;

    constructor(private firestore: AngularFirestore) {}

    addManufacture(object) {
        return from(
        this.firestore
            .collection('Manufacture')
            .doc('manufacture')
            .set(object)
        );
    }

    getManufacture() {
        return this.firestore
        .collection('Manufacture')
        .doc('manufacture')
        .snapshotChanges();
    }

    deleteManufacture() {
        this.firestore
        .collection('Manufacture')
        .doc('manufacture')
        .delete();      
    }

    show() {
        return this.firestore
        .collection('Manufacture')
        .doc('manufacture')
        .collection('manufact')
        .doc('0')
        .snapshotChanges();
    }
}

manufacture.component.ts

import { Component, OnInit } from '@angular/core';
import { ManufactureService } from './manufacture.service';
import { Manufacture } from './manufacture.model';

@Component({
selector: 'ngx-manufacture',
styles: [],
template: `
    <ng2-smart-table
    (createConfirm)="addData($event)"
    (deleteConfirm)="deleteData($event)"
    [settings]="settings"
    [source]="manu"
    >
    </ng2-smart-table>
`
})
export class ManufactureComponent implements OnInit {
    manu: Manufacture[] = [];

    constructor(private service: ManufactureService) {}

    ngOnInit() {
        this.service.getManufacture().subscribe(arr => {
        let manu_list = arr.payload.get('manufact');
        if (manu_list) {
            this.manu = manu_list;
        }
        });
    }

    settings = {
        add: {
        addButtonContent: '<i class="nb-plus"></i>',
        createButtonContent: '<i class="nb-checkmark"></i>',
        cancelButtonContent: '<i class="nb-close"></i>',
        confirmCreate: true
        },
        edit: {
        editButtonContent: '<i class="nb-edit"></i>',
        saveButtonContent: '<i class="nb-checkmark"></i>',
        cancelButtonContent: '<i class="nb-close"></i>'
        },
        delete: {
        deleteButtonContent: '<i class="nb-trash"></i>',
        confirmDelete: true
        },
        columns: {
        shopname: {
            title: 'Shop Name'
        },
        ownername: {
            title: 'Owner Name'
        },
        nic: {
            title: 'NIC'
        },
        contactno: {
            title: 'ContactNo'
        },
        address: {
            title: 'Address'
        },
        email: {
            title: 'Email'
        }
        }
    };

    addData(data) {
        alert(data.newData.email);
        this.manu.push(data.newData);
        console.log(this.manu);
        this.service.addManufacture({ manufact: this.manu }).subscribe(next => {
        data.confirm.reject();
        });
    }

    deleteData(data) {
        alert(data.emial);
        this.service.deleteManufacture();
    }
}

Then How I do This. Once I tried by following code. but not success

deleteManufacture() {
     this.firestore
    .collection('Manufacture')
    .doc('manufacture')
    .delete();      
}

Anyone can help me

Answer 1

You should update you object using "dot-notation".

I believe it would be something like this:

db.collection('Manufacture').doc('manufacture').update({
  "0.address": firebase.firestore.FieldValue.delete(),
});

The FieldValue is a sentinel value, that is, it is used to indicate something, in this case, that we want to delete the field "0.address".

As pointed in the documentation, it is "Sentinel values that can be used when writing document fields with set() or update().". So you can use it to indicate what you intend to do with the field in set or update operations. More specific, the delete marks a field for deletion. There are also others such as increment or serverTimestamp.

Dot-operator google-cloud-firestore

FieldValue