How to Check the Value of the Formgroup with Firebase


#1

Hello friends, I am still a beginner in angular & firebase. These few days I found a few problems.

  1. how to check the value of the formgroup with firebase. Then I want to create "username already used "

Whereas, the username is already stored in the database. But why can still be used.

This is my code

USER. TS

static checkUsername(control: FormControl): any {

return new Promise(resolve => {

  //Fake a slow response from server

  setTimeout(() => {
    if(control.value.toLowerCase() === "greg"){

      resolve({
        "username taken": true
      });

    } else {
      resolve(null);
    }
  }, 2000);

});

}

Signup.ts

testing: FormGroup;

this.testing = formBuilder.group({
email:[’’,Validators.compose([Validators.required, Validators.pattern(’[a-zA-Z0-9.]+[a-zA-Z0-9.%±]+@[a-zA-Z0-9.-]+’)]),UserProvider.checkUsername],
displayName:[’’, Validators.compose([Validators.maxLength(15), Validators.required])]

          });

Signup.html

        <ion-label><ion-icon name="person"></ion-icon></ion-label>
        <ion-input [class.invalid]="!testing.controls.displayName.valid && (testing.controls.displayName.dirty)" maxlength="15" minlength="4" style="color:white;border-bottom-color:white;box-shadow:none;"   [(ngModel)]="newuser.displayName" formControlName="displayName" type="text" placeholder="Username"></ion-input>
        </ion-item>

        <p *ngIf="testing.controls.displayName.pending" style="padding:0px !important; border-bottom:none !important;border-top:none;font-size: 14px;margin-top:10px;background:none;border-bottom:1px solid white;box-shadow:none;">

          Checking username...
        </p>

      <p *ngIf="!testing.controls.displayName.valid && !testing.controls.displayName.pending && (testing.controls.displayName.dirty)" style="padding:0px !important; border-bottom:none !important;border-top:none;font-size: 14px;margin-top:10px;background:none;border-bottom:1px solid white;box-shadow:none;">

          Sorry, you cannot use this username
      </p>

Please Help.