Angular 角度特性绑定目标可以更改组件特性

Angular 角度特性绑定目标可以更改组件特性,angular,property-binding,Angular,Property Binding,我是Angular 4的新手,在阅读官方教程时,我遇到了Master/Detail组件(),在那里他们在英雄列表组件和英雄细节组件之间进行了属性绑定: <app-hero-detail [hero]="selectedHero"></app-hero-detail> ) 我有什么遗漏吗?这不应该是单向绑定吗(selectedHero更改hero,但不是另一种方式)? 我确信对此有一个解释。英雄细节组件从父级接收selectedHero对象(准确地说,是对该对象的引用)作

我是Angular 4的新手,在阅读官方教程时,我遇到了Master/Detail组件(),在那里他们在英雄列表组件和英雄细节组件之间进行了属性绑定:

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

我有什么遗漏吗?这不应该是单向绑定吗(selectedHero更改hero,但不是另一种方式)?
我确信对此有一个解释。

英雄细节组件从父级接收
selectedHero
对象(准确地说,是对该对象的引用)作为输入。然后可以通过输入字段修改同一对象,但由于我们仍然引用从父对象传递的同一对象,因此更改也反映在那里。

hero details
组件从父对象接收
selectedHero
对象(准确地说,是对该对象的引用)作为输入。然后可以通过输入字段修改相同的对象,但由于我们仍然引用从父对象传递的相同对象,因此更改也反映在那里。

这是因为您将对英雄实例的引用传递给子对象,实际上两者都是相同的对象。如果你试图通过创造一个新的英雄来改变英雄的价值,你会发现这是单向的

export class HeroDetailComponent implements OnInit {
  _hero: Hero;

  @Input('hero')
  set hero(value: Hero) {
    this._hero = Object.assign(new Hero(), value);
  }
  get hero(): Hero {
    return this._hero;
  }

  constructor() { }

  ngOnInit() {
  }

}

这是因为您正在将对hero实例的引用传递给子对象,实际上两者都是相同的对象。如果你试图通过创造一个新的英雄来改变英雄的价值,你会发现这是单向的

export class HeroDetailComponent implements OnInit {
  _hero: Hero;

  @Input('hero')
  set hero(value: Hero) {
    this._hero = Object.assign(new Hero(), value);
  }
  get hero(): Hero {
    return this._hero;
  }

  constructor() { }

  ngOnInit() {
  }

}