Angular 6：將@Input添加到組件不起作用

Question

我一定缺少有關@Input ，因為我從Angular CLI收到此錯誤：

ERROR in app/web/progress/progress-button/progress-button.component.ts(10,4): Error during template compile of 'ProgressButtonComponent'
Only initialized variables and constants can be referenced in decorators because the value of this variable is needed by the template compiler in 'Input'
'Input' is not initialized at ../@angular/core/src/metadata/directives.ts(855,22).

我的模板包含以下內容：

<button class="btn btn-primary btn-progress"
    (click)="startProgress($event)"
    [myInput]="foobar">TEST
</button>

打字稿包含以下內容：

import { Component, OnInit } from '@angular/core';
import { Input } from '@angular/core/src/metadata/directives';

@Component({
  selector: 'app-progress-button',
  templateUrl: './progress-button.component.html',
  styles: []
})
export class ProgressButtonComponent implements OnInit {
  @Input() myInput: string;
  constructor() {}

  ngOnInit() {}

  startProgress(event) {}
}

我在這里想念什么？

UPDATE

遵循以下建議，我相信我抓住了我的錯誤：

<app-progress-button [myInput]="'foobar'"></app-progress-button>

並在組件中：

<button class="btn btn-primary btn-progress"
    (click)="startProgress($event)">{{myInput}}
</button>

Answer 1

如果 foob​​ar是一個字符串，則添加高逗號“'foobar'”並在該父組件中聲明Foobar。 因此，在父模板html中：

應該在父母中：

<app-child [myInput]="'foobar'"> </app-child>

和輸入的進口路徑似乎是錯的或可能有一些特別的東西。