我想使用角度数据绑定和 Input 装饰器将输入值从一个组件获取到另一个给定的子组件。
我有一个最小的例子来向你展示我想如何完成这个任务:
父模板:
<h4>Passing value of input element to child component:</h4>
<input [ngModel]="name" (ngModelChange)="name = $event">
<p>{{name}}</p>
<hello [name]="name"></hello>
Run Code Online (Sandbox Code Playgroud)
父组件:
@Component({
selector: 'my-app',
templateUrl: './app.component.html',
styleUrls: [ './app.component.css' ]
})
export class AppComponent {
name = '';
}
Run Code Online (Sandbox Code Playgroud)
子组件:
@Component({
selector: 'hello',
template: `<h4>Passed : "{{ name }}" to child component!</h4>`,
styles: [`h1 { font-family: Lato; }`]
})
export class HelloComponent {
@Input() name: string;
}
Run Code Online (Sandbox Code Playgroud)
这似乎在 stackblitz 上工作得很好:https ://stackblitz.com/edit/angular-pggcbd
但我的本地打字稿编译器响应:
Cannot find name 'Input'.ts(2304)
并标记@Input() …