问题描述
我实现了一个日历,创建了一个自定义模板,但我不知道如何创建验证器和消息。 我看到很多带有输入的示例,但没有输入 elemente。
app.modules.ts
FormlyModule.forRoot({ extras: { lazyRender: true },types: [
{ name: 'calendario',component: CalendarioComponent },],}),CalendarModule,
日历.html
<p>calendario works!</p>
<div class="p-field p-col-12 p-md-4" >
<label for="spanish">Spanish</label>
<p-calendar
[formControl]="dateFormControl"
firstDayOfWeek ="1"
dateFormat="dd/mm/yy"
inputId="spanish"
[formlyAttributes]="field"
></p-calendar>
</div>
calendario.ts
import { Component,OnInit } from '@angular/core';
import { FormControl,Validators } from '@angular/forms';
import { FieldType } from '@ngx-formly/core';
import { PrimeNGConfig } from 'primeng/api';
@Component({
selector: 'app-calendario',templateUrl: './calendario.component.html',styleUrls: ['./calendario.component.scss']
})
export class CalendarioComponent extends FieldType{}
app.component.ts
fields: FormlyFieldConfig[] = [
{
fieldGroupClassName: 'p-grid',fieldGroup: [
{
className: 'p-lg-3 p-md-6 p-col-12',key: 'calendar',type: 'calendario',templateOptions: {
label: 'Email address',placeholder: 'Enter email',required: true,}
},{
className: 'p-lg-3 p-md-6 p-col-12',key: 'Calendario',templateOptions: {
label: 'fecha',placeholder: 'fecha',},validation:{
messages:{
required: 'La fecha es necesaria'
},}
},{
className:' p-fluid',key:'texto',type:'input',templateOptions:{
label: 'Nombre',placeholder: 'Introduce un nombre',required: true
},validation:{
messages:{
required:'La fecha es necesaria'
},}
},key:'email',]
}
];
日期不显示错误且为空且不改变颜色,我不知道我必须这样做。 对不起,我的英语不好。
解决方法
大家好,我是这个问题的新手,但我终于得到了错误显示,我有改变 app.components.html
<div class="p-field p-col-12 p-md-4" >
<label for="spanish">Spanish</label>
<p-calendar
[formControl]="formControl"
firstDayOfWeek ="1"
dateFormat="dd/mm/yy"
inputId="spanish"
[ngClass]="{'ng-pristine ng-invalid ng-star-inserted ng-dirty ng-touched': (formControl.touched && formControl.getError('required')) }"
[formlyAttributes]="field"
></p-calendar>
<div *ngIf="formControl.touched && formControl.getError('required')" >
{{field.validation.messages.required }}
</div>
</div>
如果有人需要,我希望对他们有所帮助。 对不起我的英语。