angular - 检索 Firebase 快照导致加载时出现验证错误

标签 angular typescript firebase ionic-framework firebase-realtime-database

我需要从 Firebase 获取项目的快照,以便稍后在路径中使用它。我有验证以防止输入空值。在使用此快照之前,我的验证工作正常。但是,将此快照放在 ionViewDidLoad 和构造函数中会导致验证在页面首次加载时触发,并且在提交尝试时也会正确触发。我该如何解决这个问题?

这是 typescript :

export class CustomItemPage {

  user: {};
  items: FirebaseListObservable<any[]>;
  customitemname: string = '';
  customitemcat: string = '';
  listKey = "";

ionViewDidLoad(){
  firebase.auth().onAuthStateChanged((user)=> {
    this.user = user;
    console.log('authStateINVITE',user);
    if (user) {
      // User is signed in.
      var displayName = user.displayName;
      var email = user.email;
      var emailVerified = user.emailVerified;
      var photoURL = user.photoURL;
      var isAnonymous = user.isAnonymous;
      var uid = user.uid;
      var providerData = user.providerData;
      // this.navCtrl.setRoot(TutorialPage);
      // ...
    } else {
      // User is signed out.
      // ...
    }
  });

  var user = firebase.auth().currentUser;
  var uid = user.uid;

  firebase.database().ref('/userprofile/' + uid + '/' + 'list').once('value').then((snapshot)=> {
    var listkey = (snapshot.val());
    console.log(listkey)
    this.listKey = listkey;
    this.addcustomitem();//, listkey);
  });

}

  constructor(public navCtrl: NavController, private afAuth: AngularFireAuth, public af: AngularFireDatabase, public alerCtrl: AlertController, private toastCtrl: ToastController) {
    this.items = af.list('/messages', {
          query: {
            limitToLast: 50
          }
        });

        //this.user = this.afAuth.authState;
    }

        logout() {
            this.afAuth.auth.signOut();
            this.navCtrl.setRoot(SignInPage)
        }

        addcustomitem() {
            var listkey = this.listKey;
            var customitemname = this.customitemname;
            var customitemcat = this.customitemcat

            var customlistData = {
              category: customitemcat,
              foodname: customitemname,
              state: "on",
            };

            var user = firebase.auth().currentUser;
            var uid = user.uid;

            var foodid = firebase.database().ref().child('posts').push().key;

            if (customitemname==null || customitemname=="")
              {
                let alert = this.alerCtrl.create({
                      title: 'Error!',
                      message: 'Please enter a name for your item.',
                      buttons: ['Ok']
                    });
                    alert.present()
                  }
            else if (customitemcat==null || customitemcat=="")
              {
                let alert = this.alerCtrl.create({
                      title: 'Error!',
                      message: 'Please enter a category for your item.',
                      buttons: ['Ok']
                    });
                    alert.present()
                  }
            else{
                this.navCtrl.pop(); //SENDS TO PREVIOUS PAGE

                let toast = this.toastCtrl.create({
                  message: customitemname + ' was added successfully',
                  duration: 3000,
                  position: 'bottom'
                });

                toast.onDidDismiss(() => {
                  console.log('Dismissed toast');
                });

                toast.present();

                return firebase.database().ref('userlists' + '/' + listkey +  '/' + 'list' + '/' + foodid).update(customlistData);
                }
        }

}

最佳答案

我能够通过删除来解决这个问题:

this.addcustomitem();//, listkey);

来自 ionViewDidLoad()

关于angular - 检索 Firebase 快照导致加载时出现验证错误,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47785964/

相关文章:

angular - systemjs.config.js在angular 2封装结构中做了什么?

angular - NgRx 数据自定义 URL 生成器

javascript - Javascript 中的 Math.Abs​​() - 数组意外

javascript - 如何正确使用通过Firebase身份验证获得的Facebook token ?

ios - 将 getDocument 与 Firestore 链接起来?

html - Angular2 - 填充组合框/下拉列表

angular - RXJS 获取 ReplaySubject 的当前值

Node.Js 和 MongoDB Compass 连接错误

angular - 使用 mat-paginator 和 mat-table 使用可观察数组作为数据源

火力地堡 : How to secure content sent without login?