Блог

Мне не удалось удалить удаленный элемент с экрана.

Новые или обновленные элементы отображаются на экране, но я не знаю, что делать, чтобы отразить удаленные.

Я даже создал разделенный список (используя методы findIndex, emit) и объединил элемент из этого списка, но это тоже не сработало.

Мой провайдер:

 export class AssetTypeService {

    private assettypes$: any;
    private assettypesRef: any;

    private assettypeslist: AssetType[] = [];

    constructor(private http: Http) {
        this.assettypesRef = firebase.database().ref('asset-type');
        this.assettypesRef.on('child_added', this.handleDataChildAdded, this);
        this.assettypesRef.on('child_changed', this.handleDataChildAdded, this);
        this.assettypesRef.on('child_removed', this.handleDataChildRemoved, this);

        this.assettypes$ = new ReplaySubject();
    }

    get getAssetTypes() {
        return this.assettypes$;
    }

    handleDataChildAdded(snap) {
        try {
            let type: AssetType = <AssetType>{};

            type.id = snap.key;
            type.description = snap.val().description;

            this.assettypes$.next(type);
        } catch (error) {
            console.log('catching', error);
        }
    }

    handleDataChildRemoved(snap) {
        try {

            let index: number = this.findIndex(snap.key);

            if (index !== -1) {
                this.assettypeslist.splice(index, 1);
                this.emit();
            }
        } catch (error) {
            console.log('catching', error);
        }
    }

    private findIndex(key: string): number {
        return this.assettypeslist.findIndex((assetType: AssetType) => {
            return assetType.id === key;
        });
    }

    private emit(): void {
        this.assettypes$.next(this.assettypeslist);
    }

    saveAssetType(assetType: AssetType) {
        if (assetType.id == undefined) {
            assetType.id = firebase.database().ref().child('asset-type').push().key;
        }

        var updates = {};
        updates['/asset-type/'   assetType.id] = assetType;

        return firebase.database().ref().update(updates);
    }

    getAssetType(uid: string) {
        let assetType: AssetType = <AssetType>{};

        return firebase.database().ref('/asset-type/'   uid).once('value').then(function (snapshot) {
            assetType = { id: snapshot.key, description: snapshot.val().description };
            return assetType;
        });
    }

    deleteAssetType(uid: string) {
        return firebase.database().ref('asset-type/'   uid).remove();
    }
}
  

Мой контроллер:

 ngOnInit() {
    this.getAssetTypes();
}

getAssetTypes() {

    this.assetTypeService.getAssetTypes.subscribe((data) => {

        let alreadyExists = false;

        this.types.forEach(function (assetType) {
            if (assetType.id == data.id) {
                alreadyExists = true;
                assetType.description = data.description;
            }
        });

        if (!alreadyExists) {
            this.types.push(data);
        }

    }, (err) => {
        console.error(err);
        console.log(err);
    });
}

deleteAssetType(uid: string) {
    this.assetTypeService.deleteAssetType(uid).then(data => {
        this.showToast('Asset type deleted successfully');
    });
}