在 Angular 10 中,如果您尝试使用父组件将数据传递给子组件时,可能会看到控制台显示'未定义”的对象。这通常是因为您的子组件尝试访问父组件尚未初始化的属性或方法。为了解决这个问题,请确保您正在使用Angular的生命周期钩子以及正确的绑定方法来传递数据。
以下是一个简单的代码示例,向您展示如何从父组件向子组件传递数据并正常显示它们:
export class ParentComponent {
parentData = [{ id: 1, name: 'John' }, { id: 2, name: 'Doe' }];
constructor() { }
}
import { Component, Input } from '@angular/core';
@Component({
selector: 'app-child',
template: `
- {{ data.name }}
`,
})
export class ChildComponent {
@Input() childData: any[];
constructor() { }
}
现在,您已经成功将数据从父组件传递到子组件,并可以在子组件中正常显示它们,同时不会看到控制台中未定义的对象。