angular(formGroup)
<div class="cnblogs_Highlighter"><pre class="brush:html;gutter:true;"><form class="input-top" ="searchForm" >/*在form表单中使用formGroup定义一个名称*/
<mat-form-field color="primary" appearance="outline">
<mat-label>查询开始时间</mat-label>
<input matInput type="text" maxlength="40"
formControlName="startPicker"/*定义字段名称*/
="startPicker"
placeholder="查询开始日期" formControldigital="startTime">
<mat-datepicker-toggle matSuffix ="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"
="endPicker" placeholder="查询开始日期"
formControldigital="startTime">
<mat-datepicker-toggle matSuffix ="endPicker"></mat-datepicker-toggle>
<mat-datepicker #endPicker ></mat-datepicker>
</mat-form-field>
<notadd-query-month(monthDate)="onMonthClick($event)"
="{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>
</pre>
</div>
<p> </p>
<div class="cnblogs_Highlighter">
<pre class="brush:html;gutter:true;">import { FormGroup, FormBuilder, AbstractControl , FormControl } from '@angular/forms';/*导入FormGroup等*/<br><br></pre>
<pre>constructor(<br> private formBuilder: FormBuilder/*将FormBuilder注册*/</pre>
<pre><em id="__mceDel">) {<br> this.nav = 0;<br> this.searchForm = this.formBuilder.group({/*定义字段*/<br> startPicker: '',<br> endPicker: ''<br> });<br>}</em></pre>
</div>
<div class="cnblogs_Highlighter">
<pre class="brush:html;gutter:true;">get startPicker(): AbstractControl {
return this.searchForm.get('startPicker');
}
get endPicker(): AbstractControl {
return this.searchForm.get('endPicker');
}/*获取定义字段数据*/
</pre>
</div>
<p> </p>
<p> </p><br><br>
来源：https://www.cnblogs.com/cx19950223/p/11635046.html
頁:
[1]