设备ID正在生成

Question

在我的代码中，我想检索已安装应用程序的设备的设备ID，并将该设备ID存储在数据库中以备将来使用。我在这里所做的是，我已经填入了我想存储在数据库中的所有详细信息，并在提交单击时生成了该特定电话的设备ID，并显示错误device_id undefined，但是如果我第一次点击Submit按钮，设备ID未生成，但我的用户正在注册。然后我第二次点击提交，它给我错误用户已经注册。

这是我的作品：

register.js

registerUser() {

var q = firebase.database().ref('users').orderByChild('flatno').equalTo(this.flatn.value);
q.once('value', (snapshots: any) => {

      this.len = snapshots.numChildren();
            //alert('len ='+this.len);
     if(this.len < 2){
        this.alert('you can register ');
            // flatno does not yet exist, go ahead and add new user
            this.fire.auth.createUserWithEmailAndPassword(this.email.value, this.password.value)
            .then(data => {
              let currentUserUid = this.fire.auth.currentUser.uid;
              this.uniqueDeviceID.get()
              .then((uDid: any) => this.uDid = uDid)
              .catch((error: any) => alert('err' + error));

              firebase.database().ref('users/' + currentUserUid).set({
                ID: currentUserUid,
                email: this.email.value,
                password: this.password.value,
                first_name: this.fname.value,
                last_name: this.lname.value,
                contact_no: this.phone.value,
                flatno: this.flatn.value,
                wing: this.wing.value,
                parking_slot: this.vehicle.value,
                familyMember: this.familyMember.value,
                username: this.user.value,
                device_id: this.uDid
              });

              this.fdb.list("/users_device/").push({
                device_id: this.uDid,
                Uid: currentUserUid
              });
              console.log("got data ", data);
              //this.alert(data);
              this.alert("Registered!");
              data.sendEmailVerification().then(
                function () {
                  this.alert("Email Sent Please check your mailbox!");
                },
                function (error) {
                  alert("error!");
                }
              );
              this.navCtrl.push(LoginPage);
              if (this.memberForm.valid) {
                let loader = this.loadingCtrl.create({
                  content: 'Registering...',
                  dismissOnPageChange: true
                });

                loader.present();
                this.navCtrl.push(LoginPage);
              }
            })
            .catch(error => {
              console.log("got an error ", error);
              this.alert(error.message);
            });
      }else{
        this.alert('you cant register with already register flat number');
      }
     });
}

register.html

<ng-container *ngSwitchCase="'member'">
    <ion-grid>
        <ion-row>
          <ion-col>
              <form [formGroup]="memberForm">
                  <ion-list>
                    <ion-item [ngClass]="{'error-border':!memberForm.controls.firstnme.valid && memberForm.controls.firstnme.touched}">
                      <ion-label floating>
                        <ion-icon class="reg-icon" name="contact"></ion-icon> First Name</ion-label>
                      <ion-input type="text" formControlName="firstnme" [(ngModel)]="firstnme" #fnm></ion-input>
                    </ion-item>
                    <ion-item *ngIf="memberForm.controls.firstnme.hasError('required') && memberForm.controls.firstnme.touched">
                      <p>Sorry, field First name is required!</p>
                    </ion-item>
                    <ion-item *ngIf="memberForm.controls.firstnme.hasError('pattern') && memberForm.controls.firstnme.touched">
                      <p>Sorry, only small and capital letters are allowed!</p>memberForm
                    </ion-item>
                    <ion-item [ngClass]="{'error-border':!memberForm.controls.lastname.valid && memberForm.controls.lastname.touched}">
                      <ion-label floating>
                        <ion-icon class="reg-icon" name="contact"></ion-icon> Last Name</ion-label>
                      <ion-input type="text" formControlName="lastname" [(ngModel)]="lastname" #lnm></ion-input>
                    </ion-item>
                    <ion-item *ngIf="memberForm.controls.lastname.hasError('required') && memberForm.controls.lastname.touched">
                      <p>Sorry, field Last name is required!</p>
                    </ion-item>
                    <ion-item *ngIf="memberForm.controls.lastname.hasError('pattern') && memberForm.controls.lastname.touched">
                      <p>Sorry, only small and capital letters are allowed!</p>
                    </ion-item>
                    <ion-item [ngClass]="{'error-border':!memberForm.controls.usernm.valid && memberForm.controls.usernm.touched}">
                      <ion-label floating>
                        <ion-icon class="reg-icon" name="person"></ion-icon> Username</ion-label>
                      <ion-input type="text" formControlName="usernm" [(ngModel)]="usernm" #username></ion-input>
                    </ion-item>
                    <ion-item *ngIf="memberForm.controls.usernm.hasError('required') && memberForm.controls.usernm.touched">
                      <p>Sorry, field username is required!</p>
                    </ion-item>
                    <ion-item *ngIf="memberForm.controls.usernm.hasError('pattern') && memberForm.controls.usernm.touched">
                      <p>Sorry, only small and capital letters are allowed!</p>
                    </ion-item>
                    <ion-item *ngIf="memberForm.controls.usernm.hasError('minLength') && memberForm.controls.usernm.touched">
                      <p>Sorry, minimum username length is 8!</p>
                    </ion-item>
                    <ion-item *ngIf="memberForm.controls.usernm.hasError('maxLength') && memberForm.controls.usernm.touched">
                      <p>Sorry, maximum username length is 30!</p>
                    </ion-item>
                    <ion-item [ngClass]="{'error-border':!memberForm.controls.eml.valid && memberForm.controls.eml.touched}">
                      <ion-label floating>
                        <ion-icon class="reg-icon" name="mail"></ion-icon> Email</ion-label>
                      <ion-input type="email" formControlName="eml" [(ngModel)]="eml" #email></ion-input>
                    </ion-item>
                    <ion-item *ngIf="memberForm.controls.eml.hasError('required') && memberForm.controls.eml.touched">
                      <p>Sorry, field email is required!</p>
                    </ion-item>
                    <ion-item *ngIf="memberForm.controls.eml.hasError('minLength') && memberForm.controls.eml.touched">
                      <p>Sorry, minimum email length is 8!</p>
                    </ion-item>
                    <ion-item [ngClass]="{'error-border':!memberForm.controls.pwd.valid && memberForm.controls.pwd.touched}">
                      <ion-label floating>
                        <ion-icon class="reg-icon" name="contact"></ion-icon> Password</ion-label>
                      <ion-input type="password" formControlName="pwd" [(ngModel)]="paswd" #password></ion-input>
                    </ion-item>
                    <ion-item *ngIf="memberForm.controls.pwd.hasError('required') && memberForm.controls.pwd.touched">
                      <p>Sorry, field password is required!</p>
                    </ion-item>
                    <ion-item *ngIf="memberForm.controls.pwd.hasError('minLength') && memberForm.controls.pwd.touched">
                      <p>Sorry, minimum password length is 8!</p>
                    </ion-item>
                    <ion-item [ngClass]="{'error-border':!memberForm.controls.flat.valid && memberForm.controls.flat.touched}">
                      <ion-label floating>
                        <ion-icon class="reg-icon" name="home"></ion-icon> Flat No</ion-label>
                      <ion-input type="text" formControlName="flat" [(ngModel)]="flat" #flatn></ion-input>
                    </ion-item>
                    <ion-item *ngIf="memberForm.controls.flat.hasError('required') && memberForm.controls.flat.touched">
                      <p>Sorry, field Flat no is required!</p>
                    </ion-item>
                    <ion-item *ngIf="memberForm.controls.flat.hasError('pattern') && memberForm.controls.flat.touched">
                      <p>Sorry, only numbers are allowed!</p>
                    </ion-item>
                    <ion-item *ngIf="memberForm.controls.flat.hasError('maxLength') && memberForm.controls.flat.touched">
                      <p>Sorry, maximum flatNo length is 3!</p>
                    </ion-item>
                    <ion-item [ngClass]="{'error-border':!memberForm.controls.wingno.valid && memberForm.controls.wingno.touched}">
                      <ion-label floating>
                        <ion-icon class="reg-icon" name="home"></ion-icon> Wing</ion-label>
                      <ion-input type="text" formControlName="wingno" [(ngModel)]="wingno" #wing></ion-input>
                    </ion-item>
                    <ion-item [ngClass]="{'error-border':!memberForm.controls.family.valid && memberForm.controls.family.touched}">
                      <ion-label floating>
                        <ion-icon class="reg-icon" name="people"></ion-icon> Family Member</ion-label>
                      <ion-input type="text" formControlName="family" [(ngModel)]="family" #familyMmber></ion-input>
                    </ion-item>
                    <ion-item *ngIf="memberForm.controls.family.hasError('pattern') && memberForm.controls.family.touched">
                      <p>Sorry, only numbers are allowed!</p>
                    </ion-item>
                    <ion-item *ngIf="memberForm.controls.family.hasError('required') && memberForm.controls.family.touched">
                      <p>Sorry, field Total Family Member is required!</p>
                    </ion-item>
                    <ion-item *ngIf="memberForm.controls.family.hasError('minLength') && memberForm.controls.family.touched">
                      <p>Sorry, minimum Total Family Member length is 2!</p>
                    </ion-item>
                    <ion-item [ngClass]="{'error-border':!memberForm.controls.car.valid && memberForm.controls.car.touched}">
                      <ion-label floating>
                        <ion-icon class="reg-icon" name="car"></ion-icon> Vehicles</ion-label>
                      <ion-input type="text" formControlName="car" [(ngModel)]="car" #vehicle></ion-input>
                    </ion-item>
                    <ion-item *ngIf="memberForm.controls.car.hasError('pattern') && memberForm.controls.car.touched">
                      <p>Sorry, only numbers are allowed!</p>
                    </ion-item>
                    <ion-item *ngIf="memberForm.controls.car.hasError('required') && memberForm.controls.car.touched">
                      <p>Sorry, field Total vehicles is required!</p>
                    </ion-item>
                    <ion-item *ngIf="memberForm.controls.car.hasError('minLength') && memberForm.controls.car.touched">
                      <p>Sorry, minimum Total vehicles length is 8!</p>
                    </ion-item>
                    <ion-item>
                      <ion-label floating>
                        <ion-icon class="reg-icon" name="call"></ion-icon>Phone Number</ion-label>
                      <ion-input type="number" formControlName="phoneNumber" [(ngModel)]="phoneNumber" #phone></ion-input>
                    </ion-item>
                  </ion-list>
                </form>
                <div padding>
                  <button block ion-button color="button" (click)="registerUser()" item-left>Register</button>
                </div>
          </ion-col>
        </ion-row>
      </ion-grid>
  </ng-container>

Answer 1

您需要将uniqueDeviceID.get()调用和firebase.database().ref('users/' + currentUserUid).set链接起来。它们是异步的。但是看起来第二个呼叫取决于第一个。

this.uniqueDeviceID.get()
    .then((uDid: any) => {
        this.uDid = uDid;
        firebase.database().ref('users/' + currentUserUid).set({...});
        //other `this.uDid` dependant code.
    })
    .catch((error: any) => alert('err' + error));

或者您可以使用更新的async/await语法来获得更线性的代码。