Angularfire2, проблема получения документов Firestore (с использованием.get, возможно, связанная с ngOnChanges)

Question

Моя структура приложения имеет 1 сервис и 2 компонента:

Служба: содержит все подключения к пожарному хранилищу. ViewComponent: получает список из службы и отображает его. ItemManagementComponent: отображает форму и позволяет пользователю добавить новую запись.

Проблема У меня есть кнопка в ViewComponent, которая (теоретически) отправляет documentID в ManagementComponent, который затем отображает данные этого документа в форме, позволяя обновить пользователя. Прямо сейчас, когда я нажимаю кнопку, я могу отследить doumentID, и сервис полностью возвращается через мое приложение, но на самом деле я не получаю возвращенный документ. Я могу запустить точно такой же код с жестко привязанным documentID, и он прекрасно работает, поэтому, очевидно, я что-то упускаю.

обслуживание

  getUpdateInventoryItem(updateId: string) {
    console.log('service', updateId)
    this.updateId = updateId
    console.log('service2', this.inventoryCollectionRef.doc(updateId).ref.get())
    return this.inventoryCollectionRef.doc(updateId).ref.get()
  }

Просмотр HTML

<td><button type="button" class="btn btn-default" (click)="updateInventory(item.id)">Upd</button></td>
<app-item-management [updateID]="ChildUpdateId"></app-item-management>

Просмотр компонентов

@Output() inventoryUpdate = new EventEmitter();
public ChildUpdateId: string;

updateInventory(updateId: string) {
this.ChildUpdateId = updateId;
}

ItemManagement Компонент

@Input() updateID;

  ngOnChanges(incomingID: SimpleChanges) {
    if (!incomingID['updateID'].isFirstChange()) {
      for (let ID in incomingID) {
        let chng = incomingID[ID];
        let cur = JSON.stringify(chng.currentValue);
        console.log('current', cur)
        this.updateInventory(cur)
      }
    }
  }

updateInventory(incomingID) {
    console.log('updateFunction',incomingID)
    this.inventoryService.getUpdateInventoryItem(incomingID)
      .then((doc) => {
        if (doc.exists) {
          this.editItem = doc.data();
          this.inventoryForm.patchValue(this.editItem);
          this.update = true;
        } else {
          console.log("No such document!");
        }
      }).catch(function (error) {
        console.log("Error getting document:", error);
      });
  };

Итак, если я нажимаю кнопку обновления в представлении HTML, это то, что мне показывает моя консоль: снимок экрана журнала консоли С моей точки зрения, я вижу идентификатор, переданный службе, и служба имеет правильно отформатированный ответ документа на вернуть.

Если я скопирую идентификатор документа непосредственно из журнала консоли и перенесу его в функцию updateInventory в ItemManagementComponent, а затем вызову аппаратную функцию из NgOnChanges, это сработает. Просто как-то, когда я передаю этот идентификатор как переменную, это вызывает короткое замыкание.

У меня была та же самая функция updateInventory, работающая с немного другой реализацией, которая приняла переменную, так что я действительно в замешательстве. Любая помощь очень ценится!

Answer 1

Проблема Как абсолютный новичок, я использую много примеров кода, чтобы заставить вещи работать, а затем пытаюсь выяснить, ПОЧЕМУ это работает и т. Д. В этом примере фрагмент кода, который я нашел, использовал JSON.stringify, чтобы установить значение documentID, Не осознавая последствий, я оставил это.

let cur = JSON.stringify(chng.currentValue);

Чего мне не хватало, так это очень тонкой (для меня) подсказки в консоли.

**Console Return** service "X7hFhwDLzFIicl5uUCEX"

Я думал, что кавычки были просто стандартным обозначением в консоли. До тех пор, пока я не добавил причудливый файл console.log к исходной кнопке в компоненте представления и заметил, что в моем возвращении оттуда не было кавычек:

service X7hFhwDLzFIicl5uUCEX

Все, что потребовалось, чтобы исправить это, было изменить строку stringify на следующую:

let cur: string = chng.currentValue;

В противном случае остальная часть кода, кажется, делает то, что я хочу. Спасибо всем, кто заглянул!