<div [formGroup]="formGroup">
    <mat-form-field class="form-control-full-width" style="width: 100%" hintLabel="{{ suggest | translate }}">
        <mat-label>{{ placeholder | translate}}</mat-label>

        <input matInput [matDatepicker]="picker" [formControlName]="name" [required]="required" [min]="this.minDate"
            (dateInput)="changeValue($event.value)" [max]="this.maxDate" onpaste="return false">

        <mat-datepicker-toggle id="{{name}}" matSuffix [for]="picker" [disabled]="disabled"></mat-datepicker-toggle>
        <mat-datepicker #picker [disabled]="disabled"></mat-datepicker>

        <mat-error *ngIf="formGroup.controls[this.name].hasError('required') 
            && !formGroup.controls[this.name].hasError('matDatepickerMax')
            && !formGroup.controls[this.name].hasError('matDatepickerMin')
            && !formGroup.controls[this.name].hasError('matDatepickerParse')">
            {{ 'message.error.required' | translate:{'label': placeholder | translate} }}
        </mat-error>

        <mat-error *ngIf="formGroup.controls[this.name].hasError('matDatepickerMax')">
            {{ 'message.error.matDatepickerMax' | translate : {'max': getDateFormat(maxDate), 'label': placeholder | translate } }}
        </mat-error>

        <mat-error *ngIf="formGroup.controls[this.name].hasError('matDatepickerMin')">
            {{ 'message.error.matDatepickerMin' | translate : {'min': getDateFormat(minDate), 'label': placeholder | translate } }}
        </mat-error>

        <mat-error *ngIf="formGroup.controls[this.name].hasError('matDatepickerParse')">
            {{ 'message.error.matDatepickerParse' | translate : {'pattern': format } }}
        </mat-error>

    </mat-form-field>
</div>