在Angular中,可以通过@Input装饰器将数据从父组件传递给子组件。
首先,在父组件的模板中,使用子组件的选择器,并使用属性绑定将数据传递给子组件。例如:
然后,在子组件的类中,使用@Input装饰器定义一个属性来接收父组件传递的数据。例如:
import { Component, Input } from '@angular/core';
@Component({
selector: 'app-child',
template: '{{ data }}
'
})
export class ChildComponent {
@Input() data: any;
}
在上面的代码中,子组件的模板中使用了插值表达式{{ data }}
来显示父组件传递的数据。
这样,父组件的数据就会传递给子组件,并在子组件中显示出来。
如果父组件数据发生变化,子组件也会自动更新。
希望这个示例能帮助到你!