angular 2 4 5 - как определить переменную объекта в component.ts

Question

Я хочу определить переменную объекта в 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

Answer 1

Спасибо.

Я решил мою проблему в вашем коде. (Я уже сделал это, прежде чем вы ответили.)

Я хотел знать. В скриптах типа ==> инициализация модели.

При инициализации модели в скрипте типа, как определить тип объекта.

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;



}

Answer 2

Это сообщение об ошибке отображается, потому что 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>