无法设置指令输入值

Question

我已经将遇到的问题缩小到这个指令代码：

@Directive({
  selector: '[tdStepTracker]'
})
export class StepTrackerDirective {
  @Input('tdStepTracker') keyName: string;

  ngOnInit() {
    console.log('keyName', this.keyName);
  }
}

并在这里使用：

@Component({
  selector: 'my-app',
  template: `
    <div>
      <h2 [tdStepTracker]="something">Hello {{name}}</h2>
    </div>
  `,
})
export class App {
  name:string;
  constructor() {
    this.name = 'Angular2'
  }
}

当我记录 this.keyName 的内容时，我得到 undefined。我原本希望得到 something。

这里有一个 link 给 plunker：https://plnkr.co/edit/Cbw6CHbsppiuVpW4kpTh

Answer 1

你似乎想传递一个字符串

<h2 [tdStepTracker]="something">Hello {{name}}</h2>

应改为

之一

<h2 [tdStepTracker]="'something'">Hello {{name}}</h2>
<h2 tdStepTracker="something">Hello {{name}}</h2>

您的代码绑定到 class App 的属性 something，但不存在。

Plunker example

无法设置指令输入值

Unable to set directive input value

directive

angular