Angular Dragula - Не обновляет Firebase при падении

Question

У меня есть AngularFireList элементов.

Я разделил элементы на массивы и использую их для заполнения нескольких элементов div для одной сумки-драгула на основе значения местоположения каждого элемента, которое соответствует идентификатору элемента div.

При добавлении одного элемента в другой div значение местоположения перетаскиваемого элемента обновляется до идентификатора нового div. Все это работает, как и ожидалось, но обновления значения местоположения элемента не сохраняются в Firebase, поэтому при проверке элемента я вижу обновленное значение, но если я обновляю страницу, ничего не сохраняется.

Любые указатели на то, где я ошибся, будут оценены!

HTML:

<div 
    [dragula]='"bag-equipment"' 
    [dragulaModel]="equipmentArmor"
    id="armor"
>
    <mat-card *ngFor="let item of equipmentArmor">
        {{ item.name }}
    </mat-card>
</div>

<div 
    [dragula]='"bag-equipment"'
    [dragulaModel]="equipmentBagOfHolding"
    id="bagOfHolding"
>
    <mat-card *ngFor="let item of equipmentBagOfHolding">
        {{ item.name }} 
    </mat-card>
</div>

TS:

    ngOnInit() {

    this.dragula.drop.subscribe(value => {

        // Get location item is dragged to
        let destination = value[2]['id'];

        // Get item's name and clean it up
        let itemName = value[1]['innerText'];
        itemName = value[1]['innerText'].trim();
        itemName = itemName.slice(0, -5);

        // Update the FireList's itemList
        this.itemList.find(item => item.name == itemName).location = destination;

    });

    let data = this.itemService.getData();

    data.snapshotChanges().subscribe(item => {

        this.itemList = [];
        item.forEach(element => {
            let json = element.payload.toJSON();
            json["$key"] = element.key;
            this.itemList.push(json as Item);
        });

        this.itemList = this.itemList.filter(item => item.equippable == true);
        this.equipmentArmor = this.itemList.filter(item => item.location == 'armor');
        this.equipmentBagOfHolding = this.itemList.filter(item => item.location == 'bagOfHolding');
        this.equipmentMisc = this.itemList.filter(item => item.location == 'misc');
        this.equipmentWeapons = this.itemList.filter(item => item.location == 'weapons');

    });
}

Answer 1

Я бы предположил, что equipmentBagOfHolding/this.itemList не совпадает с массивом, возвращаемым из itemService.getData(). Поскольку ваш пользовательский интерфейс привязан к этим массивам, когда они изменяются, он обновляется, а массив из itemService.getData () - нет.

Answer 2

Таким образом, я наконец понял, что обновление модели не возвращает обновление к firebase; Я так привык к угловым интерполяциям значений, что я полностью забыл, что Firebase не обновляется автоматически. Так что я просто отодвинул обновленный объект обратно, и все заработало как положено. Просто показывает, что в 99% случаев это самая глупая вещь.

HTML-фрагмент:

this.itemList.find(item => item.name == itemName).location = destination;
this.itemService.updateItem(this.itemList.find(item => item.name == itemName));