core/forms/form-group.component.ts
A form group helps to validate an input of a form element.
Example : <c8y-form-group [hasWarning]="user.email.length === 0">
<label translate for="userEmail">Email</label>
<input
id="userEmail"
class="form-control"
type="email"
name="email"
[maxlength]="254"
autocomplete="off"
placeholder="{{'e.g. joe.doe@exmpl.com' | translate}}"
[(ngModel)]="user.email"
email
required
>
<c8y-messages>
<c8y-message *ngIf="user.email.length === 0" translate></c8y-message>
<c8y-message name="required" text="The E-Mail is SUPER required"></c8y-message>
</c8y-messages>
</c8y-form-group>
AfterContentInit
DoCheck
OnDestroy
| host | { |
| selector | c8y-form-group |
| standalone | true |
| imports |
MessagesComponent
NgIf
|
| templateUrl | ./form-group.component.html |
Properties |
Methods |
Inputs |
HostBindings |
Accessors |
| hasError |
Type : boolean
|
Default value : false
|
| hasSuccess |
Type : boolean
|
Default value : false
|
| hasWarning |
Type : boolean
|
Default value : false
|
| novalidation |
Type : boolean
|
Default value : false
|
| status |
Type : string
|
| class.has-error |
Type : boolean
|
| class.has-success |
Type : boolean
|
| class.has-warning |
Type : boolean
|
| initFormControl |
initFormControl()
|
|
Returns :
void
|
| initNgModel |
initNgModel()
|
|
Returns :
void
|
| ngAfterContentInit |
ngAfterContentInit()
|
|
Returns :
void
|
| ngDoCheck |
ngDoCheck()
|
|
Returns :
void
|
| ngOnDestroy |
ngOnDestroy()
|
|
Returns :
void
|
| observeControl | ||||||
observeControl(control: FormControl | NgModel)
|
||||||
|
Parameters :
Returns :
void
|
| updateErrors | ||||||
updateErrors(control: FormControl | NgModel)
|
||||||
|
Parameters :
Returns :
void
|
| customErrorMessage |
Type : MessagesComponent
|
Decorators :
@ContentChild(MessagesComponent, {static: false})
|
| errors |
Type : ValidationErrors
|
| formControlName |
Type : FormControlName
|
Decorators :
@ContentChild(FormControlName, {static: true})
|
| model |
Type : NgModel
|
Decorators :
@ContentChild(NgModel, {static: true})
|
| error |
geterror()
|
| warning |
getwarning()
|
| success |
getsuccess()
|
<ng-content></ng-content>
<c8y-messages *ngIf="!customErrorMessage" [show]="errors"></c8y-messages>