CODEWITHSUNDEEP
angular5angular-forms
3gwebtrain
3gwebtrain

Reputation: 15293

How to avoid multiple error message?

In my FormControl i see both error enabled at a time. how to prevent this? I require to show only one on the time by condition:

<div *ngIf="senderPostalcode.errors && (senderPostalcode.dirty || senderPostalcode.touched )" class="error">{{senderPostalcodeError}}</div> //let show only when error and  dirty
<div *ngIf="senderPostalcode?.errors?.maxlength || senderPostalcode?.errors?.minlength"  class="error">{{senderPostalcodeLEN_BET}}</div> // when this show rest can disapear

What is the condition need i require to add here?

Upvotes: 0

Views: 70

Answers (1)

Joe Belladonna
Joe Belladonna

Reputation: 1339

Your first div will be shown on every error when your control is touched and dirty: "senderPostalcode.errors && (senderPostalcode.dirty || senderPostalcode.touched )"

To hide this div on min and max error add: "senderPostalcode.errors && (senderPostalcode.dirty || senderPostalcode.touched ) && !senderPostalcode.errors.maxlength && !senderPostalcode.errors.minlength" When you receive min or max error this div will not be shown.

Upvotes: 1

Related Questions