首页 > 其他 > 详细

angular(formGroup)

时间:2019-10-08 14:18:15      阅读:91      评论:0      收藏:0      [点我收藏+]
<form class="input-top" [formGroup]="searchForm" >/*在form表单中使用formGroup定义一个名称*/
        <mat-form-field color="primary" appearance="outline">
            <mat-label>查询开始时间</mat-label>
            <input matInput type="text" maxlength="40"
                   formControlName="startPicker"/*定义字段名称*/
                   [matDatepicker]="startPicker"
                   placeholder="查询开始日期" formControldigital="startTime">
            <mat-datepicker-toggle matSuffix [for]="startPicker"></mat-datepicker-toggle>
            <mat-datepicker #startPicker></mat-datepicker>
        </mat-form-field>
        <mat-form-field color="primary" appearance="outline">
            <mat-label>查询结束时间</mat-label>
            <input matInput type="text" maxlength="40" formControlName="endPicker"
                   [matDatepicker]="endPicker" placeholder="查询开始日期"
                   formControldigital="startTime">
            <mat-datepicker-toggle matSuffix [for]="endPicker"></mat-datepicker-toggle>
            <mat-datepicker #endPicker ></mat-datepicker>
        </mat-form-field>
        <notadd-query-month  (monthDate)="onMonthClick($event)"
                             [disableDate]="{startDate: searchForm.value.startPicker , endDate: searchForm.value.endPicker}">
        ></notadd-query-month>
        <div class="example-button-row right">
            <button mat-raised-button color="primary" (click)="onView()" >
                <mat-icon>
                    visibility
                </mat-icon>
                查看报表
            </button>
        </div>
    </form>

  

import { FormGroup, FormBuilder, AbstractControl , FormControl } from ‘@angular/forms‘;/*导入FormGroup等*/

constructor(
private formBuilder: FormBuilder/*将FormBuilder注册*/
) {
this.nav = 0;
this.searchForm = this.formBuilder.group({/*定义字段*/
startPicker: ‘‘,
endPicker: ‘‘
});
}
get startPicker(): AbstractControl {
        return this.searchForm.get(‘startPicker‘);
    }

    get endPicker(): AbstractControl {
        return this.searchForm.get(‘endPicker‘);
    }/*获取定义字段数据*/

  

  

angular(formGroup)

原文:https://www.cnblogs.com/cx19950223/p/11635046.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!