angular - 两种方式绑定(bind)不适用于 Angular 为 2 的原始对象

在 Angular 2 中，我尝试将字符串组件属性绑定(bind)到输入指令参数。看起来这两种方式绑定(bind)不适用于原始属性，即使我使用“盒子里的香蕉”也是如此。

组件:

@Component({
  selector: "pairs-result",
  template: `
  <ul class="search-list">
    <li [(rowHover)]="showDetail">{{showDetail}}<pair-row></pair-row></li>
  </ul>
  `,
  directives: [HoverDirective]
})
export class PairsComponent {
  public showDetail: string = "initial value";
}

指令:

@Directive({
  selector: '[rowHover]'
})
export class HoverDirective {
  @Input('rowHover') hover: any;
  @HostListener('mouseenter') onMouseEnter() {
     this.hover = "mouse enter";
  }
  @HostListener('mouseleave') onMouseLeave() {
     this.hover = "mouse leave";
  }
}

Code with Primitive not working

但是，如果我将“悬停”字符串属性更改为对象属性，它就会起作用。

Code with Object works

最佳答案

如果您使用对象，它不是绑定(bind)而是更改检测。

您需要创建类型为EventEmitter、名称为rowHoverChange 的@Output 属性，并手动发出新值。

查看绑定(bind)是如何实现的plunkr

关于angular - 两种方式绑定(bind)不适用于 Angular 为 2 的原始对象，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/41892733/