Firestore保存数据不稳定的结果

Question

使用firestore实时数据库运行角度5项目（不是旧的firebase数据库，新的数据库）。

我有一个非常奇怪的问题，我将数据保存到Firestore，当我运行Chrome调试时，我保存的对象正在按预期工作。

但是，当我在Chrome中打开调试工具时运行相同的过程时，它只保存对象上的一些属性。

我没有以任何方式更改我的代码，我正在使用相同的文件运行相同的进程。 createAt和updatedAt的简单属性正在保存，但数据对象未保存的对象数组。除非我在调试模式下运行代码，否则一切正常。

非常困惑。欢迎任何想法。

APP组件

import { Component } from '@angular/core';
import { FirestoreService } from './firestore.service';


import * as xmlLoader from 'xml2js';
import { parseString } from 'xml2js';

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {

  name = 'Angular 5';

  constructor(private fss: FirestoreService) {

  }

  resultSet = [];

  loadXmlFile(files: FileList) {

    Array.from(files).forEach(file => {
      const myReader: FileReader = new FileReader();
      myReader.readAsText(file);

      const propertyString = this.removeExtFromFileName(file.name);

      this.extractKronosConfiguration(myReader, this.resultSet, propertyString);
    });

    this.emitKronosConfiguration(this.resultSet);

  }

  removeExtFromFileName(file): string {
    return file.slice(0, -4);
  }

  emitKronosConfiguration(resultSet) {
    this.fss.add('kronos', resultSet);
  }

  private extractKronosConfiguration(myReader, resultSet, propertyString) {

    myReader.onloadend = function (e) {

      xmlLoader.parseString(myReader.result, (err, response) => {
        resultSet[propertyString] = [];
        if (response.Kronos_WFC.Response !== undefined) {
          response.Kronos_WFC.Response.forEach(responseItem => {
            if (responseItem[propertyString] !== undefined) {
              responseItem[propertyString].forEach(item => {
                if (item.$ !== undefined) {
                  resultSet[propertyString].push(item.$);
                }
              });
            }


});
    }
  });
};

} }

FIRESTORE SERVICE

import { Injectable } from '@angular/core';
import {
  AngularFirestore,
  AngularFirestoreCollection,
  AngularFirestoreDocument
} from 'angularfire2/firestore';
import { Observable } from 'rxjs/Observable';
import * as firebase from 'firebase/app';

type CollectionPredicate<T> = string | AngularFirestoreCollection<T>;
type DocPredicate<T> = string | AngularFirestoreDocument<T>;

@Injectable()
export class FirestoreService {

  colRef: any;

  constructor(
    public afs: AngularFirestore) {

  }

  col<T>(ref: CollectionPredicate<T>, queryFn?): AngularFirestoreCollection<T> {
    return typeof ref === 'string' ? this.afs.collection<T>(ref, queryFn) : ref;
  }

  add<T>(ref: CollectionPredicate<T>, data) {
    const timestamp = this.timestamp;
    return this.col(ref).add({
      ...data,
      updatedAt: timestamp,
      createdAt: timestamp
    });
  }

  get timestamp() {
    return firebase.firestore.FieldValue.serverTimestamp();
  }


}

Answer 1

为了防止将来有人读到这篇文章，我最终得到了Orion on codementor的问题。

基本上这是异步编程的古老问题。基本上当我在调试中运行时，我停止程序查看代码，因此异步任务在完成下一步之前完成。

当未在调试模式下运行时，某些功能在先前任务完成之前运行，因此数据未被保存。

通过等待某些步骤使函数异步，确保完成依赖于前一步骤的所有步骤（作为Promise），确保每次都保存数据。