javascript - angular 2绑定(bind)到组件选择器

我有一个属性为true时需要隐藏的组件。有没有办法在组件内部解决此问题。

例：

@Component({
  selector: 'prio-tab',
  changeDetection: ChangeDetectionStrategy.OnPush,
  template:
  `
      <div [hidden]="!active">
        stuff
      </div>
    `
})

export class PrioTabComponent {
  @Input() title;
  active:boolean = false;
}

在这里，我想让实际的“ prio-tab”元素依赖于active-flag。不只是prio-tab中的内容。

或者在声明prio-tab标记时可以使用自身，如下所示：

<prio-tab [hidden]="this.active">
     stuff
</prio-tab>

我猜一个可行的解决方案是在其父级中创建对prio-tab组件的引用，然后遍历父级。但是，如果我有多个prio-tab，该怎么办？

最佳答案

您可以使用@HostBinding()

export class PrioTabComponent {
  @Input() title;

  @HostBinding('hidden')
  active:boolean = false;
}

关于javascript - angular 2绑定(bind)到组件选择器，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/41059307/