Как мне сделать запрос Firestore для использования с get () и valueChanges ()? - PullRequest
Новая
       66

Как мне сделать запрос Firestore для использования с get () и valueChanges ()?

0 голосов
/ 13 марта 2020

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

Я подумал, что мог бы использовать одну функцию для выполнения запроса, а затем вызывать различные функции в зависимости от того, какую кнопку пользователь нажал, используя get() для загрузки и valueChanges() для просмотра данных в реальном времени. Но когда я пытаюсь это сделать, я получаю следующие ошибки в консоли браузера. (Это с query как тип any - если я указываю тип как AngularFirestoreCollection, я получаю ошибки относительно моего типа для get() детали в VSCode)

Ошибка: «Uncaught ( в обещании): TypeError: this.query.get не является функцией

Могу добавить, что ранее у меня было две совершенно разные (рабочие) функции для загрузки и просмотра в реальном времени. И для загрузки я использовал Приведенный ниже запрос. Я понимаю, что это на самом деле запрос Firestore, тогда как «запрос», который я пытаюсь использовать в своем обновленном коде, является AngularFirestoreCollection. Но есть ли способ, которым я могу создать какой-то тип Query / Collection, который будет работать для get() и valueChanges()?

Старый (рабочий) запрос: 

var query = this.afs.collection(collection).ref.where('module', 'in', array_part);

Попытка общей функции makeQuery (): 

  onSubmit(value, buttonType): void {
    if (buttonType=='realtime') {
      this.getRealTimeData(value);
    }
    if (buttonType=='download') {
      this.downloadCsv(value);
    }
  }

  async downloadCsv(value) {
    this.query = this.makeQuery(value);
    this.dataForDownload = await this.getDataForDownload();
    this.dataForDownload = JSON.stringify(this.dataForDownload['data']);
    console.log('Data: ', this.dataForDownload);
    var date = new Date();
    var date_str = this.datePipe.transform(date, 'yyyy-MM-ddTHH-mm');
    this.makeFileService.downloadFile(this.dataForDownload, 'OPdata-' + date_str);
  }

  getDataForDownload() {
    return this.query.get()
      .then(function (querySnapshot) {
        var jsonStr = '{"data":[]}';
        var dataObj = JSON.parse(jsonStr); //making object we can push to
        querySnapshot.forEach(function (doc) {
          JSON.stringify(doc.data()), ', id: ', doc.id);
          dataObj['data'].push(doc.data());
        });
        return dataObj;
      })
      .catch(function (error) {
        console.log("Error getting documents: ", error);
      });
  }

  async getRealTimeData(value) {
    this.query = await this.makeQuery(value);
    this.data = this.query.valueChanges();
  }

  async makeQuery(value) {
    var collection: string;
    return this.query = this.afs.collection<DataItem>('CollectionName', ref => ref.where('datetime', '>=', '2020-01-15T09:51:00.000Z').orderBy('datetime', 'desc').limit(100));
  }

1 Ответ

2 голосов
/ 13 марта 2020

valueChanges() - это метод, используемый в angularfire для извлечения данных из пожарного хранилища, в то время как метод get() используется для извлечения из пожарного хранилища, но с использованием ванили javascript.

* 1006. * Смешивание обоих методов вернет ошибку, как вы видели в своем коде. Поэтому, поскольку angularfire был создан над кодом javascript firebase, вы должны иметь возможность использовать valueChanges() для просмотра данных в реальном времени на веб-сайте и для загрузки данных.
...