我有通过表单构建器构建的组件,现在在该表单中我需要包含一个只有一个输入框作为表单控件的组件.
add.ts
this.newForm = this.fb.group({
name: ['', [Validators.required]],
surname:['', [Validators.required]],
time: ''
});
Run Code Online (Sandbox Code Playgroud)
"时间"必须作为一个不同的组成部分.
add.html
<div class="form-group">
<label class="col-md-3 control-label" for="name">{{'forms.newForm.label.configuration.name' | translate}}</label>
<div class="col-md-3">
<input type="text" formControlName="name" placeholder="placeholder"
class="form-control input-md" type="text">
<small *ngIf="!newForm.controls.name.valid && newForm.controls.name.dirty" class="text-danger">
Name is required.
</small>
</div>
<label class="col-md-3 control-label" for="surname">{{'forms.newForm.label.configuration.name' | translate}}</label>
<div class="col-md-3">
<input type="text" formControlName="surname" placeholder="placeholder"
class="form-control input-md" type="text">
<small *ngIf="!newForm.controls.surname.valid && newForm.controls.name.dirty" class="text-danger">
Surname is required.
</small>
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
为time.html
<div>
<div class="col-md-7">
<input class="form-control input-md" type="text" (keydown)="eventHandler($event)" maxlength="11">
<small *ngIf="!validTime" …Run Code Online (Sandbox Code Playgroud)