在Angular中,@Input属性用于从父组件传递数据到子组件。虽然它与依赖注入不完全相关,但可以使用@Input属性来实现依赖注入的效果。
以下是一个示例,演示了如何在Angular中使用@Input属性进行依赖注入:
import { Component } from '@angular/core';
@Component({
selector: 'app-parent',
template: `
Parent Component
`
})
export class ParentComponent {
myData = 'Hello, child!';
}
import { Component, Input } from '@angular/core';
@Component({
selector: 'app-child',
template: `
Child Component
{{ data }}
`
})
export class ChildComponent {
@Input() data: string;
}
在上面的示例中,父组件通过[data]属性将数据传递给子组件。子组件使用@Input()装饰器来接收该数据,并在模板中显示它。
这样,就可以通过@Input属性实现依赖注入的效果,将数据从父组件传递到子组件中。