アイコンの変更方法はモバイル番号、メールIDによります

Question

入力欄にメールアドレスを入力する必要がある場合は、メールアドレスを表示する必要があります。メールアイコンを表示するには、モバイル番号を入力してください。
フォーム有効性確認番号IDの検証ショーのアイコンが、これは働いていません。..

<ion-item [class.error]="!mobilenumber.valid && mobilenumber.touched" class="tog_input animated fadeInLeft delay"> 
      <span item-left *ngIf="mobIcon == true" class="countryCode">+91</span> 
       <ion-icon name="ios-person" *ngIf="emailIcon == true" item-left color="light" class="PreLoginIcon" ></ion-icon> 
      <ion-label id="output" class="labels" stacked floating> enter email/ mobile no</ion-label> 
       <ion-input type="text" [(ngModel)]=" LoginObj.mobilenumber" maxlength="45" formControlName="mobilenumber" ></ion-input> 
      </ion-item> 

    constructor() { 
    this.registerForm = formBuilder.group({ 
     'mobilenumber': ['', Validators.compose([Validators.required, Validators.minLength(5), this.MailorNumber])], 
     'Password': ['', Validators.compose([Validators.required, Validators.minLength(2)])] 
    }); 
    this.mobilenumber = this.registerForm.controls['mobilenumber']; 
    this.Password = this.registerForm.controls['Password']; 

    } 
    MailorNumber(control: FormControl): { [s: string]: boolean } { 
     var email = /^(([^<>()\[\]\.,;:\s@\"]+(\.[^<>()\[\]\.,;:\s@\"]+)*)|(\".+\"))@(([^<>()[\]\.,;:\s@\"]+\.)+[^<>()[\]\.,;:\s@\"]{2,})$/i; 
     var mob = /(^([1-9]{1})([0-9]{9})$)/; 
      if ((control.value != '')) { 
       return { MailorNumber: true }; 
      } 
      else if (!(control.value.match(mob))){ 
       this.mobIcon= true; 
       return { MailorNumber: true }; 

      } 
      else if(!(control.value.match(email))){ 
      this.emailIcon= true; 
      return { MailorNumber: true }; 

      }} 

Answer 1

は、if文で、あなたのロジックを確認してください：

：

if ((control.value != '')) { // <-- returns true if control has value 
    return { MailorNumber: true }; 
} 
else if (!(control.value.match(mob))){ // <-- if the control has value how to evaluate this? 
    this.mobIcon= true; 
    return { MailorNumber: true }; 
} 
else if(!(control.value.match(email))){ // <-- and this? 
    this.emailIcon= true; 
    return { MailorNumber: true }; 
} 

確かに、それはこのような何かをお読みください

if (!control.value) { 
    return { MailorNumber: true }; 
} else if (control.value.match(email)) { 
    this.emailIcon = true; 
    return { MailorNumber: true }; 
} else if (control.value.match(mob)) { 
    this.mobIcon = true; 
    return { MailorNumber: true }; 
}