更新了Angular2中@Parent（）的语法

Question

I am looking at a sample for angular2 where a class constructor references @Parent(). I get a Error:(58, 18) TS2304: Cannot find name 'Parent'. I saw another answered questioned that said to use 'Host' but I got the same error. I'm using Alpha.45. Here is a reference to the sample. Full code is at the end.

constructor(@Parent() tabs:Tabs) {
        tabs.addTab(this);
        this._active=true ;
    }

Answer 1

@Host parameter decorator just restrict the dependency resolution with the host component. You don't have to use it to get the closest component of specified Type. However, you may need to use @Inject with forwardRef if your dependency isn't yet defined.

For example (see this plunk , I don't use forwardRef there):

import {Component, Input, Inject, forwardRef} from 'angular2/angular2'

@Component({
  selector: 'tab',
  template: 'Tab {{ index }}'
})
class Tab {
  @Input() index: number;

  constructor(@Inject(forwardRef(() => Tabs)) tabs: Tabs) {
    console.log(tabs);
  }
}

@Component({
  selector: 'tabs',
  template: 'Tabs (<ng-content></ng-content>)'
})
class Tabs {}

@Component({
  selector: 'my-app',
  directives: [Tabs, Tab],
  template: `
    <tabs>
      <tab index="1"></tab>
      <tab index="2"></tab>
    </tabs>
  `
})
export class App {}