角度父组件属性更新不运行子组件中的方法答案

【问题标题】：angular parent component property update does not run methods in child component角度父组件属性更新不运行子组件中的方法
【发布时间】：2021-02-10 13:00:05
【问题描述】：

我在父组件中有以下代码

ngOnInit(): void {
    this.service.method().subscribe(r => {
        this.data = r;
    });
}

该组件正在以下列方式使用子组件

        <childComponent [data]="data">
        </childComponent>

现在子组件有如下方法

ngOnInit(): void {
     if (!this.childProperty) return;

    // do some processing here
}

我遇到的问题是，最初在子组件上运行ngOnInit 时没有数据，因为service.method() 没有在父组件上运行。一旦数据返回，子组件应该再次运行ngOnInit，但是我该怎么做呢？

【问题讨论】：

标签： angular

【解决方案1】：

您可以在模板中添加条件

<childComponent [data]="data" *ngIf="data && data.length > 0">
</childComponent>

因此，一旦数据可用，就不仅仅是渲染组件。

或

另一种方法是，您可以实现ngOnChanges() 而不是ngOnInit()，因此只要输入属性发生更改（在API 调用之后），它就会调用该钩子，您可以在该钩子中进行处理。

【讨论】：