（角度）错误类型错误无法读取未定义的属性“日期”答案

【问题标题】：(Angular) error typeerror cannot read property 'date' of undefined（角度）错误类型错误无法读取未定义的属性“日期”
【发布时间】：2020-11-04 16:41:15
【问题描述】：

您好，我是 Angular 新手，遇到了一些问题。我正在尝试从输入中读取属性并将其传输到将数据放入数据库的服务器，但由于以下问题，到达服务器的对象为空：`error typeerror cannot read property 'date' of未定义``

我猜问题出在[(ngModel)]="Productivity.Date"这一行

这可能是一个新手错误，我已经尝试测试可能的解决方案，但没有找到适合我问题的示例。

IntroducingLaborProductivity.html

                        <div class="col-1">
                            <div class="input-group-desc">
                                <input [(ngModel)]="productivity.Date" class="input--style-5" id="input--style-5" type="date" name="date">                    
                                <label class="label--desc">date</label>
                            </div>
                        </div>

IntroducingLaborProductivity.ts

import { Component, OnInit, Input } from '@angular/core';
import { Time } from '@angular/common';
import { Router } from '@angular/router';
import { UserService } from 'src/app/shared/services/user.service';
import { Productivity } from 'src/app/shared/models/productivity';
import { FormControl } from '@angular/forms';

@Component({
  selector: 'app-introducing-labor-productivity',
  templateUrl: './introducing-labor-productivity.component.html',
  styleUrls: ['./introducing-labor-productivity.component.css']
})
export class IntroducingLaborProductivityComponent implements OnInit {

productivity:Productivity;

  constructor(private router:Router,private userservice:UserService) { }

  ngOnInit() {
  }
  
 InsertProductivity(){
   this.userservice.InsertProductivity(this.productivity).subscribe(
     res=>{
       if(res)
       alert("succsful")
     },
     err=>(alert("faild"))
   )
    
 }
}

Productivity.ts（模型）

import { Time } from '@angular/common'

export class Productivity {
    ProductivyCode:number
    UserCode: number
    ProductivityNum: number
    Cmment:string
    Date:Date
    DurationOfPreparation:Time
    ProductivityStatus:number
}

user.service.ts

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http'
import { Observable } from 'rxjs';
import { map } from 'rxjs/operators';
import { User } from '../models/user.model';
import { Productivity } from '../models/productivity';
import { Time } from '@angular/common';
//import { read } from 'fs';



@Injectable({
  providedIn: 'root'
})
export class UserService {

  url: string = "https://localhost:44387/api/User/";
  user: User;
  isLoggedIn: boolean;

  constructor(private http: HttpClient) { }

  InsertProductivity ( prod:Productivity) {
  return this.http.post(this.url + 'productivity',prod) ;
 }
}

【问题讨论】：

this.productivity 最初是 undefined 并且从未实际设置过，不清楚您期望的值来自哪里。
对不起，我不清楚，我正在尝试将一些值放入输入中并将其吸收到上述变量中
但是当productivity 永远不能是undefined 之外的任何东西时，您尝试设置productivity.Date，并且undefined.Date 确实是类型错误。你需要一些初始值，即使它只是一个空对象{}。请注意，没有任何方法或访问器的类是毫无意义的，只需为该类型使用接口即可。

标签： angular typescript

【解决方案1】：

最初this.productivity 是未定义的，当尝试访问成员日期时，它会引发错误并破坏它的绑定以防止出现多个错误。

你需要给this.productivity一个像这样的初始值

export class IntroducingLaborProductivityComponent implements OnInit {

productivity:Productivity = new Productivity();

.
.
.

【讨论】：