我有选定日期的表格。如果日期形式没有任何变化,如何禁用提交按钮?
我的 html 代码
<div class="col-xs-6">
<label><i class="far fa-calendar-alt"></i> Start <span class="text-danger">*</span></label>
<input id="startTrip1" name="NgbDate" data-provide="datepicker" ngbDatepicker #d="ngbDatepicker" [markDisabled]="markDisabled" [minDate]="minDates" type="text" class="form-control form-flat" [(ngModel)]="ad.start_date" (dateSelect)="onDateSelect($event, ad)" (blur)="validateInput()" (click)="d.toggle()" [ngModelOptions]="{standalone: true}" [disabled]="form.controls.tripduration.hasError('required')" >
<div class="text-danger" *ngIf="(ad.start_date == '' || ad.start_date == undefined) && ngForm.submitted">
* This field is required
</div>
<div class="text-danger" *ngIf="form.controls.tripduration.hasError('required')">
* Fill the durations first
</div>
</div>
//submit button
<button class="col-xs-12 text-center text-strong pointer custom-trip-btn" (click)="publishTrip()">
<button class="custom-trip-btn">SUBMIT</button>
Run Code Online (Sandbox Code Playgroud) 我有一个反应式 Angular-6 形式,其中我使用了 mat-button-toggle-group
<mat-button-toggle-group #group="matButtonToggleGroup" [(value)]="myFlagForButtonToggle" (change)="onEndpointValChange(group.value)" multiple=false formControlName='endpoints' [(ngModel)]="myFlagForButtonToggle">
<mat-button-toggle *ngFor="let item of endpointToggleOptions;" [value]="item">{{item}}</mat-button-toggle>
</mat-button-toggle-group>
Run Code Online (Sandbox Code Playgroud)
在 ts 文件中我有
myFlagForButtonToggle: String[] = ["Single"];
endpointToggleOptions: Array<String> = ["Single", "Multiple"];
Run Code Online (Sandbox Code Playgroud)
但在 UI 中,默认情况下没有选择切换按钮。
请帮忙,我做错了什么
我的模型是这样的
this.outerForm = this._formBuilder.group({
firstFormGroup: this._formBuilder.group({
pidNumber: ['', [Validators.pattern(this.spacePattern)]],
}),
secondFormGroup: this._formBuilder.group({
endpoints: ['', [Validators.required]]
})
});
Run Code Online (Sandbox Code Playgroud)
编辑:我希望 mat-button-toggle-group 也与我的模型绑定。