data-binding - 如何在angular2中进行孙子和父母之间的双向绑定？

Question

我需要在父母和孙子之间做两种绑定方式。因此，我尝试在孩子和其他两个之间进行两种绑定。

有人这样想

孙子 <==> 子 <==> 父

但它不像我预期的那样工作。

这是我的孙子：

<svg [class.small-size]="!isFullScreen" [class.full-screen]="isFullScreen">
  <ng-content></ng-content>
</svg>
...

export class FullScreenableSvgComponent {

  @Input() isFullScreen: Boolean;
  @Output() isFullScreenChange: EventEmitter<Boolean>;

  constructor() {
    this.isFullScreen = this.isFullScreen || false;
    this.isFullScreenChange = new EventEmitter<Boolean>();
  }
  ...
}

这是我的孩子：

<fullscreenable-svg (window:resize)="onResize()" [(isFullScreen)]="isFullScreen">
    ...
</fullscreenable-svg>

export class VisualizationComponent implements OnChanges, OnInit {

  @Input() isFullScreen: Boolean;
  @Output() isFullScreenChange: EventEmitter<Boolean>;

  constructor(private elementRef: ElementRef) {

    this.isFullScreenChange = new EventEmitter<Boolean>();
  }
  ...
}

这是我的父母：

<visualization [(isFullScreen)]="isFullScreen" [nodes]="[]" [links]="[]">         
</visualization>
<div [hidden]="isFullScreen" style="position:absolute;">
    i am working
</div>