如何在Angular中绑定一个对象内的对象数组？

export class AppComponent {
  user: {
    name: string;
    hobbies: string[];
  };
}

<div>
  <h2>{{ user.name }}</h2>
  <ul>
    <li *ngFor="let hobby of user.hobbies">{{ hobby }}</li>
  </ul>
</div>

export class AppComponent {
  user: {
    name: string;
    hobbies: string[];
  };

  constructor() {
    this.user = {
      name: 'John',
      hobbies: ['Reading', 'Gaming', 'Traveling']
    };
  }
}