angular - 如何在 Angular 5 应用程序中正确使用 @Input()？

我在父组件中有以下模板：

<my-table (loaded)="onTableLoaded()" [objId]="objId"></my-table>

我遇到的问题是加载子组件时 objId 为空。我可以在孩子中添加 api 调用，但我想避免它。知道如何允许父级中的 api 调用的值可以转移到子级吗？

标签： angular

如果你想在 Angular 组件之间传递数据，你应该使用来自 @Angular/core 库的 Input 和 Output 属性。为了传递数据，您应该使用 @Input() ，然后带上您想要的属性的名称。例如，在子组件中的 ts 中，您可以编写：

  @Input() dataEntry:boolean;

并且在您的主机组件中，当数据位于主机组件中时，您将此输入用作子组件的属性：

在主机组件 HTML 中，您可以编写：

    <child [dataEntry]="....."></child>

但有关更多信息，您可以在此处阅读文档：