Custom component, manually set the validity

Ionic Framework ionic-v3
1

Hello, I have a custom component that I use in a form that implements ControlValueAccessor.

The component’s template is

<ion-item>
    <ion-label floating>phone</ion-label>
    <ion-input  [(ngModel)]="telObj.number" (change)="setNumber($event)" type="text"></ion-input>                                    
</ion-item>


<ion-item>
    <ion-label>I use whatspapp </ion-label>
    <ion-checkbox [(ngModel)]="apps" (ionChange)="setApps()" color="primary" [checked]="apps"></ion-checkbox>
</ion-item>

<ion-item>   
    <ion-label>I read sms</ion-label>
    <ion-checkbox [(ngModel)]="sms" (ionChange)="setSms()"  color="primary" [checked]="sms"></ion-checkbox>
</ion-item>

The component with the form uses it as usual
<tel-input [apps]="true" [sms]="true" formControlName="telephone"></tel-input>

this component’s control validates the form

this.WizardOfferContactsPageForm = formBuilder.group({
            telephone:['',Validators.required,isTelephone.check.bind(isTelephone)]
 });

everything works well, but even when the form is invalid (becouse the number is not correct) the bottom border of the input is green becouse internally ion-input does not have a validator.

What would be the best way to act to have a consistent class applied to the ion-input ?

Thanks