组件的类型上不存在属性“endDate”

Question

属性endDate 不存在于类型TestComponent

test.Component.cs

--

import { Component} from '@angular/core';
import { Router } from '@angular/router'
import {Message} from 'primeng/api';
import { FormGroup, FormControl, FormBuilder, Validators } from '@angular/forms';

@Component({
  templateUrl: './test.component.html',
  selector: 'test',
  providers:[TestService]
})
export class TestComponent  {
    public testingForm: FormGroup;

    constructor(
        private router: Router,
        private userService: UserService,
        ,private formBuilder: FormBuilder
      ) { 
        console.log("Inside constructor...");
      }
      
      ngOnInit():void {  
           console.log("Inside onNotify ...."); 
           this.testingForm = this.formBuilder.group({
            startDate: new FormControl('', Validators.required), 
            endDate: new FormControl('', Validators.required), 
            message: new FormControl('', Validators.required)
           });     
           this.loadData();       
      }
      
      ...////.....
      
      
      }

--

test.component.html

--

<form [formGroup]="testingForm"  >
<div>
<label class="control-label col-sm-4">Start Date:</label>
<div class="col-sm-8">
    <p-calendar formControlName="endDate" [showIcon]="true"></p-calendar><span style="margin-left:35px">{{endDate|date}}</span>
</div>
</div>
</form>

app.module.ts - 已导入 formModule

import { FormsModule, ReactiveFormsModule } from '@angular/forms';

以下是我得到的错误：

 ERROR in src/testing/test.component.html:37:115 - error TS2339: Property 'endDate' does not exist on type 'testingComponent'.

    37             <p-calendar formControlName="endDate" [showIcon]="true"></p-calendar><span style="margin-left:35px">{{endDate|date}}</span>
                                                                                                                         ~~~~~~~

      src/testing/test.component.ts:19:16
        19   templateUrl: './test.component.html',
                          ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
        Error occurs in the template of component TestComponent.

非常感谢任何输入。 TIA

Answer 1

没错，它没有。

例如，您可以添加 getter 以从 FormGroup 中提取它：

get endDate(): Date {
    return this.testingForm ? this.testingForm.value.endDate : null;
}