angular大侠教程Master/Detail组件。为什么 parent 中的英雄会发生变化？

Question

我正在关注 Master/Detail Components - Angular tutorial heroes。我的问题是，如果 hero 发送不绑定 hero 的不同变量，为什么 parent 也会发生变化。我相信那一定不会发生。

Angular example here (heroes tour stackblitz.com)。相关代码：

<h2>My Heroes</h2>
<ul class="heroes">
  <li *ngFor="let hero of heroes"
    [class.selected]="hero === selectedHero"
    (click)="onSelect(hero)">
    <span class="badge">{{hero.id}}</span> {{hero.name}}
  </li>
</ul>

 <app-hero-detail [hero]="selectedHero"></app-hero-detail>

Answer 1

那是因为 hero 被作为参考传递。在下方 hero-detail-component 中 ngModel 直接更改 hero.name。

并且因为它们是直接更改的，所以不需要为父级发出事件。

英雄：

<app-hero-detail [hero]="selectedHero"></app-hero-detail>

hero-detail:

<input [(ngModel)]="hero.name" placeholder="name"/>

export class HeroDetailComponent implements OnInit {

  @Input() hero: Hero;

angular大侠教程Master/Detail组件。为什么 parent 中的英雄会发生变化？

angular heroes tutorial Master/Detail Components. Why hero change in parent?

ionic2

angular-components

angular