Angular 5 - “无法读取未定义的属性”答案

【问题标题】：Angular 5 - "Cannot read property of undefined"Angular 5 - “无法读取未定义的属性”
【发布时间】：2018-02-02 06:46:46
【问题描述】：

在 Angular 5 中，用于输入

<input name="techSpecMeta.make" [(ngModel)]="techSpecMeta.make" type="text" class="form-control border-input" placeholder="Enter car brand">

出现错误无法读取未定义的属性“make” 在 Object.eval [作为 updateDirectives]

export class UserComponent implements OnInit {
  constructor(private vahinfo: VehicleInfo) {}
  ngOnInit() {}
  techSpecMeta: {};
  onSave = function(vehicle, isValid: boolean) {
    this.vahinfo.saveVehicle(vehicle).subscribe(data => {
      console.log(data.data)
    }, error => this.errorMessage = error)
  }
}

【问题讨论】：

您是否在组件中定义了 techSpecMeta？你可以这样做：techSpecMeta: {};在组件级别。
嗨 rohan，是的，我的 component.ts 导出类 UserComponent 实现 OnInit{ 构造函数（私有 vahinfo : VehicleInfo）{ } ngOnInit(){ } techSpecMeta: {}; onSave = function(vehicle, isValid : boolean){ this.vahinfo.saveVehicle(vehicle) .subscribe( data=> { console.log(data.data) },error => this.errorMessage = error) } }
您是否已将 techSpecMeta 分配给您创建的模型？
这通常发生在资源异步时。为避免该错误，请尝试将保存模型的元素放在 *ngIf 标记内。喜欢 - <div *ngIf='x.a'>{{x.a}}</div>

标签： angular

【解决方案1】：

techSpecMeta: {};

在 Type 脚本中，这意味着声明一个 {} 类型的属性，没有初始化任何值。同理：

techSpecMeta: Object;

你应该这样做

techSpecMeta = {};

要使绑定工作，您还需要属性make。

techSpecMeta = {make: null};

理想情况下，您应该为 TechSpecMeta 创建一个类/接口

class TechSpecMeta {
    make: null;
    anotherProperty: null;
}

并在你的组件中使用它

techSpecMeta = new TechSpecMeta();

【讨论】：

我想以单一形式发布 vehRegNumber techSpecMeta.make techSpecMeta.model servSpecMeta.buy.purchaseDate'的数据：servSpecMeta.buy.purchasePrice'：我的方法对以下类定义和导入是否正确？ vehicle.ts----------------------------------------- 类 TechSpecMeta{ 制作：空值;型号：空； } 类 ServSpecMeta{ 购买：{购买日期：空；购买价格：空； } }------------------------------------------------ ---
请不要将代码放入 cmets。在您的问题中添加代码和查询，并评论您已更新您的问题。

【解决方案2】：

请尝试按照下面的描述初始化它

public techSpecMeta = <any> {};

【讨论】：

【解决方案3】：

请尝试如下初始化：

techSpecMeta = {}

【讨论】：

【解决方案4】：

我在 component.html 文件中也遇到了同样的问题，我在其中将 ngModel 属性定义为 client.firstName，当您在 component.ts 文件中创建对象时，请确保对象应该是客户端。例如客户 : 客户 = { 名：''，姓：''，电子邮件：''，电话：''，余额：0 } 客户端是接口。小写客户端是我在component.html中提到的对象。

【讨论】：

我被这个错误困住了一个小时。阅读 cmets 终于有所帮助。非常感谢先生。

【解决方案5】：

您的 techSpecMeta 对象没有 make 属性。尝试在 Init 方法中初始化一个。

ngOnInit(){
this.techSpecMeta= {make: ""};  }

【讨论】：