要将变量传递给Angular 8 Web组件,可以使用@Input装饰器。
首先,在要接收变量的组件中,使用@Input装饰器定义一个属性,用于接收传递的变量。例如,假设我们有一个名为child-component的子组件,想要将一个名为message的变量传递给它:
import { Component, Input } from '@angular/core';
@Component({
selector: 'app-child-component',
template: `
{{ message }}
`
})
export class ChildComponent {
@Input() message: string;
}
然后,在父组件中,使用属性绑定语法将变量传递给子组件。例如:
在父组件的类中,我们需要定义一个名为parentMessage的属性,并将想要传递给子组件的变量赋值给它。例如:
import { Component } from '@angular/core';
@Component({
selector: 'app-parent-component',
template: `
`
})
export class ParentComponent {
parentMessage = 'Hello from parent component!';
}
现在,父组件的parentMessage变量的值将传递给子组件的message变量,子组件将显示父组件传递的消息。
注意:要确保在使用@Input装饰器定义属性之前导入@angular/core中的Input装饰器。
上一篇:编辑Chrome自定义模拟设备
下一篇:编辑窗口对话框未预填充