AbstractControlDirective рдХреА рд╕рдВрдкрддреНрддрд┐ рддреНрд░реБрдЯрд┐рдпрд╛рдБ
рдореЗрд░реЗ рдкрд╛рд╕ рдирд┐рдореНрди рдХреЛрдб рд╣реИ:
<div>
<label for="fullname">Passenger name:</label>
<input
type="text"
name="fullname"
required
#fullname="ngModel"
[ngModel]="detail?.fullname">
<div class="error" *ngIf="fullname.errors?.required && fullname.dirty">
Passenger name is required.
</div>
</div>
ngModel рд╕рдВрджрд░реНрдн рдХреА errors
рд╕рдВрдкрддреНрддрд┐ рдХреЗ рдЕрдВрджрд░ рдПрдХ рд╕рдВрдкрддреНрддрд┐ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдХреЗ рдпрд╣ рдореБрдЭреЗ рд╡рд╣ рддреНрд░реБрдЯрд┐ рджрд┐рдЦрд╛рддрд╛ рд╣реИред
рдпрд╣ рдХреЛрдИ рддреНрд░реБрдЯрд┐ рдирд╣реАрдВ рд╣реЛрдиреА рдЪрд╛рд╣рд┐рдП рдХреНрдпреЛрдВрдХрд┐ рдпрд╣ рдЯреЗрдореНрдкрд▓реЗрдЯ-рдЪрд╛рд▓рд┐рдд рдкреНрд░рдкрддреНрд░реЛрдВ рдХреЗ рд▓рд┐рдП рдорд╛рдиреНрдп рд╕рд┐рдВрдЯреИрдХреНрд╕ рд╣реИред
рдмрдВрдж рд╣реЛрдиреЗ рдХреЗ рдХрд╛рд░рдг #149 . рдХрд╛ рдбреБрдкреНрд▓реАрдХреЗрдЯ
рдореИрдВрдиреЗ рдЙрдкрд░реЛрдХреНрдд рджреГрд╖реНрдЯрд┐рдХреЛрдг рдХреЗ рд╕рд╛рде рдкреНрд░рдпрд╛рд╕ рдХрд┐рдпрд╛ рд╣реИ рд▓реЗрдХрд┐рди рдпрд╣ рдмреБрд░реА рддрд░рд╣ рд╡рд┐рдлрд▓ рд░рд╣рд╛ред
рдХреГрдкрдпрд╛ рдЗрд╕ рдХреЛрдб рдХреЛ рджреЗрдЦреЗрдВ -
<div *ngIf="username.errors.minlength">Minimum length should be {{username.errors.minlength.requiredLength}}</div>
рдЯреАрдПрд╕ рдХрдВрдкрд╛рдЗрд▓рд░ рджреНрд╡рд╛рд░рд╛ рдереНрд░реЛрдЗрдВрдЧ рдПрд░рд░ -
[рдХреЛрдгреАрдп] рдкрд╣рдЪрд╛рдирдХрд░реНрддрд╛ 'рдЖрд╡рд╢реНрдпрдХ' рдкрд░рд┐рднрд╛рд╖рд┐рдд рдирд╣реАрдВ рд╣реИред '__type' рдореЗрдВ рдРрд╕рд╛ рдХреЛрдИ рд╕рджрд╕реНрдп рдирд╣реАрдВ рд╣реИ
рдореИрдВрдиреЗ рдПрдХ рд╣реА рдЪреАрдЬрд╝ рдХреА рдХреЛрд╢рд┐рд╢ рдХреА рд▓реЗрдХрд┐рди рдмрд╛рд╣рд░ рдирд╣реАрдВ рдирд┐рдХрд▓ рдкрд╛рдпрд╛
рдЙрджрд╛рд╣рд░рдг
"?" рдЬреЛрдбрд╝рдиреЗ рдХрд╛ рдкреНрд░рдпрд╛рд╕ рдХрд░реЗрдВ "рдХреАрдордд" рдХреЗ рдмрд╛рджред
"
<div *ngIf="firstName.errors.required">First Name is required.
<div *ngIf="firstName.errors.minlength">First Name should be minimum 3 character.</div>
<div *ngIf="firstName.errors.pattern">First Name doesn't Match pattern.</div>
</div>
i tried this
рдпрд╣ рдЗрд╕ рдореБрджреНрджреЗ рдХреЛ рд╣рд▓ рдХрд░реЗрдЧрд╛:
рдмрд╕ рдмреВрд▓ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдХреЗ рдХрд╛рд╕реНрдЯрд┐рдВрдЧ рдЬреЛрдбрд╝реЗрдВ !! :
рдЙрджрд╛рд╣рд░рдг
"?" рдЬреЛрдбрд╝рдиреЗ рдХрд╛ рдкреНрд░рдпрд╛рд╕ рдХрд░реЗрдВ "рдХреАрдордд" рдХреЗ рдмрд╛рджред
"рдХреАрдордд рдЪрд╛рд╣рд┐рдПред"рдореИрдВрдиреЗ рдЗрд╕ рдореБрджреНрджреЗ рдХреЛ рдЬреЛрдбрд╝рдХрд░ рд╣рд▓ рдХрд┐рдпрд╛? рдкреИрд░рд╛рдореАрдЯрд░ рд╕реЗ рдкрд╣рд▓реЗ рдФрд░ рддреНрд░реБрдЯрд┐рдпреЛрдВ рдХреЗ рдмрд╛рдж рдирд╣реАрдВ? рд▓реЗрдХрд┐рди рдХреНрдпрд╛ рдЖрдк рдХреГрдкрдпрд╛ рдЗрд╕реЗ рд╡рд┐рд╕реНрддреГрдд рдХрд░ рд╕рдХрддреЗ рд╣реИрдВ рдФрд░ рдпрд╣ рд╕рдордЭрд╛рдиреЗ рдХреА рдХреЛрд╢рд┐рд╢ рдХрд░ рд╕рдХрддреЗ рд╣реИрдВ рдХрд┐ рдХреЗрд╡рд▓ рдкреНрд░рд╢реНрдирд╡рд╛рдЪрдХ рдЪрд┐рдиреНрд╣ рдХреЛ рд╣рд┐рд▓рд╛рдиреЗ рд╕реЗ рдпрд╣ рд╕рдорд╕реНрдпрд╛ рдХреИрд╕реЗ рд╣рд▓ рд╣реЛ рдЬрд╛рддреА рд╣реИ? @Danielaparona
рдпрд╣ рдЗрд╕ рдореБрджреНрджреЗ рдХреЛ рд╣рд▓ рдХрд░реЗрдЧрд╛:
рдмрд╕ рдмреВрд▓ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдХреЗ рдХрд╛рд╕реНрдЯрд┐рдВрдЧ рдЬреЛрдбрд╝реЗрдВ !! :
рдпрд╛рддреНрд░реА рдХрд╛ рдирд╛рдо рдЖрд╡рд╢реНрдпрдХ рд╣реИредрдЗрд╕рд╕реЗ рдореЗрд░реА рд╕рдорд╕реНрдпрд╛ рд╣рд▓ рд╣реЛ рдЧрдИ! рдзрдиреНрдпрд╡рд╛рдж!
рдЙрджрд╛рд╣рд░рдг
"?" рдЬреЛрдбрд╝рдиреЗ рдХрд╛ рдкреНрд░рдпрд╛рд╕ рдХрд░реЗрдВ "рдХреАрдордд" рдХреЗ рдмрд╛рджред
"рдХреАрдордд рдЪрд╛рд╣рд┐рдПред"рдЗрд╕рдиреЗ рдореЗрд░реЗ рд▓рд┐рдП рдХрд╛рдо рдХрд┐рдпрд╛ред рдХреНрдпрд╛ рдЖрдк рдХреГрдкрдпрд╛ рдореБрдЭреЗ рдмрддрд╛ рд╕рдХрддреЗ рд╣реИрдВ рдХрд┐ "?" рдХреНрдпреЛрдВ рдЬреЛрдбрд╝рдирд╛ рдЪрд╛рд╣рд┐рдП
рдпрд╣ рдореЗрд░реА рд╕рдорд╕реНрдпрд╛ рдХреЛ рднреА рд╣рд▓ рдХрд░рддрд╛ рд╣реИ рдмрд╕ рдЬреЛрдбрд╝реЗрдВ?
рд▓реЗрдХрд┐рди рди рддреЛ рдмреВрд▓рд┐рдпрди рдХреЗ рд░реВрдк рдореЗрдВ рдХрд╛рд╕реНрдЯрд┐рдВрдЧ рдХрд░рдирд╛ рдпрд╛ ?(рд╣реЛ рд╕рдХрддрд╛ рд╣реИ рдирд╣реАрдВ) рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдирд╛ рдЗрд╕ рддрдереНрдп рдХреЛ рд╣рд▓ рдирд╣реАрдВ рдХрд░рддрд╛ рд╣реИ рдХрд┐ IntelliSense _errors_ рдХреЗ рдЧреБрдг рдирд╣реАрдВ рдвреВрдВрдв рд╕рдХрддрд╛ рд╣реИред
рдХреАрдордд рдХрд╛ рдкреНрд░рдпрд╛рд╕ рдХрд░реЗрдВ ['рддреНрд░реБрдЯрд┐рдпреЛрдВ'] ['рдЖрд╡рд╢реНрдпрдХ']
@EeeEui рдж? (рд╕реБрд░рдХреНрд╖рд┐рдд рдиреЗрд╡рд┐рдЧреЗрд╢рди рдСрдкрд░реЗрдЯрд░) рдПрдХ рдЪрд░ рд▓реЗрдЧрд╛, рднрд▓реЗ рд╣реА рд╡рд╣ рдЕрдорд╛рдиреНрдп рд╣реЛ рдФрд░ рдЖрдВрддрд░рд┐рдХ рд░реВрдк рд╕реЗ рдЕрдкрд╡рд╛рдж рд╕реЗ рдирд┐рдкрдЯреЗрдВ (рдЗрд╕ рдорд╛рдорд▓реЗ рдореЗрдВ рдЕрдорд╛рдиреНрдп = рдЧрд▓рдд)ред
?
рдореЗрд░реЗ рд▓рд┐рдП рдХрд╛рдо рдирд╣реАрдВ рдХрд┐рдпрд╛ред !!
рдХреЗрд╡рд▓ рдореЗрд░реЗ рдорд╛рдорд▓реЗ рдореЗрдВ рдХрд╛рдо рдХрд┐рдпрд╛ред
<div class="alert alert-danger" *ngIf="username.touched && username.invalid" class="alert alert-danger">
<div *ngIf="!!username.errors.required">Username is required</div>
<div *ngIf="!!username.errors.minlength">Username Should be minimum {{ !!username.errors.minlength.requiredLength }} Charecters.</div>
</div>
рдпрд╣ рдЕрдм VSCode рдХреЗ рд╕рд╛рде рдПрдХ рд╕рдорд╕реНрдпрд╛ рдХреА рддрд░рд╣ рд▓рдЧрддрд╛ рд╣реИ, рдХреНрдпреЛрдВрдХрд┐ рддреНрд░реБрдЯрд┐ рдЕрднреА рднреА рдореЗрд░реЗ рд╕рдВрдкрд╛рджрдХ рдореЗрдВ рд╣рд╛рдЗрд▓рд╛рдЗрдЯ рдХреА рдЧрдИ рд╣реИ, рд▓реЗрдХрд┐рди рдХреЛрдгреАрдп рдЗрд╕рдХрд╛ рдкрддрд╛ рдирд╣реАрдВ рд▓рдЧрд╛рддрд╛ рд╣реИред рдореИрдВрдиреЗ рд╡реАрдПрд╕рд╕реАрдУрдбреА рдХреЗ рд▓рд┐рдП рдЗрд╕реЗ рд╣рд▓ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдЬреЛ рдХрд┐рдпрд╛ рд╡рд╣ рдПрдХ рдлрд╝рдВрдХреНрд╢рди рдХреЗ рд╕рд╛рде рдЯрд╛рдЗрдкрд╕реНрдХреНрд░рд┐рдкреНрдЯ рдкрдХреНрд╖ рдкрд░ рддреНрд░реБрдЯрд┐ рдХреА рдЬрд╛рдВрдЪ рдХрд░рддрд╛ рд╣реИред
рдПрдЪрдЯреАрдПрдордПрд▓
рдЯрд╛рдЗрдкрдкреНрд░рддрд┐
рдпрд╣ рдореЗрд░реЗ рд▓рд┐рдП рдХрд╛рдо рдХрд░рддрд╛ рд╣реИ рдФрд░ рдпрд╣ рд╕рд╛рдл рджрд┐рдЦрддрд╛ рд╣реИред
<div class="error" *ngIf="fullname.hasError('required')">
рдпрд╣ рддрд░реАрдХрд╛ рдЙрдкрдпреЛрдЧреА рд╣реИ рднрд▓реЗ рд╣реА рд╣рдо рдХрд╕реНрдЯрдо рд╕рддреНрдпрд╛рдкрди рдХреЛ рд╕рдВрднрд╛рд▓рддреЗ рд╣реИрдВ рдЬреИрд╕реЗ рдХрд┐ fullname.hasError('invalidName')
рдореБрдЭреЗ рдПрдХ рд╣реА рддреНрд░реБрдЯрд┐ рдереАред *ngIf="formGroup?.get('fullName').hasError('required')"
рдХрд░рдирд╛ рдореЗрд░реЗ рд▓рд┐рдП рдХрд╛рдо рдХрд░ рдЧрдпрд╛
рдпрд╣ рдЕрдм VSCode рдХреЗ рд╕рд╛рде рдПрдХ рд╕рдорд╕реНрдпрд╛ рдХреА рддрд░рд╣ рд▓рдЧрддрд╛ рд╣реИ, рдХреНрдпреЛрдВрдХрд┐ рддреНрд░реБрдЯрд┐ рдЕрднреА рднреА рдореЗрд░реЗ рд╕рдВрдкрд╛рджрдХ рдореЗрдВ рд╣рд╛рдЗрд▓рд╛рдЗрдЯ рдХреА рдЧрдИ рд╣реИ, рд▓реЗрдХрд┐рди рдХреЛрдгреАрдп рдЗрд╕рдХрд╛ рдкрддрд╛ рдирд╣реАрдВ рд▓рдЧрд╛рддрд╛ рд╣реИред рдореИрдВрдиреЗ рд╡реАрдПрд╕рд╕реАрдУрдбреА рдХреЗ рд▓рд┐рдП рдЗрд╕реЗ рд╣рд▓ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдЬреЛ рдХрд┐рдпрд╛ рд╡рд╣ рдПрдХ рдлрд╝рдВрдХреНрд╢рди рдХреЗ рд╕рд╛рде рдЯрд╛рдЗрдкрд╕реНрдХреНрд░рд┐рдкреНрдЯ рдкрдХреНрд╖ рдкрд░ рддреНрд░реБрдЯрд┐ рдХреА рдЬрд╛рдВрдЪ рдХрд░рддрд╛ рд╣реИред
рдПрдЪрдЯреАрдПрдордПрд▓
рдЯрд╛рдЗрдкрдкреНрд░рддрд┐
рдмрдбрд╝реЗ рднрд╛рдИ, рдпрд╣ рдЖрдкрдХреЗ рд▓рд┐рдП рдмрд╣реБрдд рдмрдбрд╝реА рдкрд░реЗрд╢рд╛рдиреА рд╣реИред
рдХреНрдпрд╛ рдХрд░реЗрдВ *ngIf="yourForm.get('yourfield').hasError('required')"
рдирд┐рд╖реНрдХреНрд░рд┐рдпрддрд╛ рдХреЗ рдХрд╛рд░рдг рдпрд╣ рд╕рдорд╕реНрдпрд╛ рдЕрдкрдиреЗ рдЖрдк рд▓реЙрдХ рд╣реЛ рдЧрдИ рд╣реИред
рдпрджрд┐ рдЖрдк рд╕рдорд╛рди рдпрд╛ рд╕рдВрдмрдВрдзрд┐рдд рд╕рдорд╕реНрдпрд╛ рдХрд╛ рд╕рд╛рдордирд╛ рдХрд░ рд░рд╣реЗ рд╣реИрдВ рддреЛ рдХреГрдкрдпрд╛ рдПрдХ рдирдпрд╛ рдореБрджреНрджрд╛ рджрд░реНрдЬ рдХрд░реЗрдВред
рд╣рдорд╛рд░реА рд╕реНрд╡рдЪрд╛рд▓рд┐рдд рд╡рд╛рд░реНрддрд╛рд▓рд╛рдк рд▓реЙрдХрд┐рдВрдЧ рдиреАрддрд┐ рдХреЗ рдмрд╛рд░реЗ рдореЗрдВ рдФрд░ рдкрдврд╝реЗрдВред
_рдпрд╣ рдХреНрд░рд┐рдпрд╛ рдХрд┐рд╕реА рдмреЙрдЯ рджреНрд╡рд╛рд░рд╛ рд╕реНрд╡рдЪрд╛рд▓рд┐рдд рд░реВрдк рд╕реЗ рдХреА рдЧрдИ рд╣реИред_
рд╕рдмрд╕реЗ рдЙрдкрдпреЛрдЧреА рдЯрд┐рдкреНрдкрдгреА
рдпрд╣ рдЗрд╕ рдореБрджреНрджреЗ рдХреЛ рд╣рд▓ рдХрд░реЗрдЧрд╛:
рдмрд╕ рдмреВрд▓ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдХреЗ рдХрд╛рд╕реНрдЯрд┐рдВрдЧ рдЬреЛрдбрд╝реЗрдВ !! :
рдпрд╛рддреНрд░реА рдХрд╛ рдирд╛рдо рдЖрд╡рд╢реНрдпрдХ рд╣реИред