如何更改图标取决于移动没有，电子邮件标识

Question

输入域的电子邮件或手机号码，如果用户输入电子邮件ID，需要显示电子邮件图标，手机号码显示国家代码
表单验证手机号码验证显示跨度+91，电子邮件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 }; 
}