angular 2 4 5-如何在component.ts中定义对象变量

时间:2018-06-28 05:39:54

标签: angular angular5

我想在component.ts中定义对象变量

  

components.ts

  user: {
         brand: {
                 id: string,
                name: string
         },
  [k: string]: any} = {};

  ==> I want Define 'brand' object to the 'user' variable
  

view.html

  <form class="example-form">
    <mat-form-field class="example-full-width">
      <input matInput [(ngModel)]="user.userName"> ==> *** No Error ***
    </mat-form-field>
  </form>

  <form class="example-form">
    <mat-form-field class="example-full-width">
      <input matInput [(ngModel)]="user.brand.id"> ==> *** Error ***
    </mat-form-field>
  </form>
  

user.brand.id错误消息==>无法读取未定义的属性'id'

错误所指向的地方=> user.brand.id

2 个答案:

答案 0 :(得分:0)

由于user.brand目前未定义,因此显示此错误消息。 当我尝试反映问题时,我什么也没得到,因为您没有共享导致错误的部分代码。造成错误的最明显原因可能是user模型在组件文件或其接口中的初始化。按照提供的格式解决您的问题 我的代码是->

组件文件

params: UserModel = {
  reg_username: '',
  password: {
     reg_password: ''
  }
};
foo(): void {
  this.params.password.reg_password = this.params.reg_username;
}

接口文件

export interface UserModel {
  reg_username: '';
  password: {
    reg_password: '';
  }
}

HTML文件

<input [(ngModel)]="params.reg_username">
<p>Value: {{ params.reg_username }}</p>
<input [(ngModel)]="params.password.reg_password">
<p>Value: {{ params.password.reg_password }}</p>
<button (click)='foo()'>FOO</button>

答案 1 :(得分:0)

谢谢。

我在您的代码中解决了我的问题。 (在您回答之前,我已经做到了。)

我想知道。在类型脚本中,==>模型初始化。

在类型脚本中初始化模型时,如何定义对象类型。

params: UserModel = {
reg_username: '',
password: {
   reg_password: '' ==> '' I wondered if it was the right way in typescript
                        ex) normally reg_password: string; 
                               OR    reg_password: any;



}