У меня есть HTML ниже, где я реализовал обязательное свойство HTML5:
<div class="col-sm-3">
<label>{{question.placeholder}}<span *ngIf="question.required">*</span></label>
</div>
<div class="col-sm-9">
<mat-form-field style="width:100%">
<input matInput [placeholder]="question.placeholder" [id]="question.key" [maxLength]="question.maxLength" [formControlName]="question.key"
type="email" [required]="question.required"[readonly]="question.readonly" [value]="question.value" (keyup)="checkValue($event, question)"
(paste)="checkPasteValue($event, question)">
<mat-hint align="end">{{question.value ? question.value.length : 0}} / {{question.maxLength}}</mat-hint>
</mat-form-field>
</div>
Это поле электронной почты.
[обязательно] = "question.required"
Ниже находится кнопка формы, которую нужно активировать, когда форма действительна.
<button mat-raised-button class="md-primary md-raised pull-right" color="primary" style="margin-right:10px;" *ngIf="isEditMode" [disabled]="!dataEntryForm.valid"
(click)="updateDataEntry($event)">UPDATE</button>
кнопка не активируется до тех пор, пока ввод не заполнен, тогда как он предварительно заполнен.Так что это должно быть удовлетворено для необходимого.Так что же следует использовать в таком случае?
РЕДАКТИРОВАТЬ Форма предварительно заполняется с помощью службы:
editSectionDataItem(item: any) {
var me = this;
// / var decodedItem = this.decodeDataArray([item]);
// console.log(item, this.originalData);
var decodedItem = this.originalData.filter(function (originalItem) {
return originalItem.id == item.id;
});
console.log(decodedItem, item);
var mission = {
widgetConfig: this.widgetConfig,
settings: this.settings,
fields: this.fields,
isEditMode: true,
data: flattenJSON(decodedItem[0])
}
console.log(mission);
this._widgetService.missionToOpenDataEntryForm(mission);
}