angular - 以 Angular 2 刷新组件

Question

我对 Angular 2 还很陌生，想了解更多。

我的问题是:我们如何刷新组件(重新调用 ngOnInit)。

此组件将调用 API 以从数据库中检索一些数据。如果单击按钮，PUT 请求将发送到 API 以更新数据库中的数据。 由于更改发生在数据库中而不是组件本身，我认为 ngOnChange 或其他更改检查方法不会起作用。在这里，我试图让 ngOnInit 再次被调用，以便组件可以接收更新的数据。

我已尝试使用 router nagivate 刷新此页面，但它不起作用。

所有 HTTP 方法都发生在另一个服务文件中，我不会在这里显示它们，因为它不相关。

应用程序模块.ts

@NgModule({
    imports: [
        RouterModule.forRoot([{path: 'data', component: DataComponent}]);
    ]
})

数据.组件.ts

@Component({
    template: `
        <button (click)= "onclick()">Click Me</button>
    `,
    ....
});

export class DataComponent implements OnInit{
    fetchData(): void{
        this.dataService.dataSessions().subscribe(
                data => this.data= data,
                error=> console.error(error),
                ()=> {}
        );
    }

     onclick(){
         this.dataChangeService.updateData().subscribe( response=> console.log(response));
         this.router.navigate['/data'];
     }

    ngOnInit(): void{
        this.fetchData();
    }

任何答案都将不胜感激，我总是很乐意了解更多信息。

Answer 1

一旦您对后端的调用得到解决，请尝试调用 this.fetchData() 方法。像这样的东西:

response=> { this.fetchData() ...