javascriptangularangularjsserver-side-renderingangular-universal

angular 13 SSR, assign a value to a property in onInit, causes ngOnInit() to be called multiple times

In app.component.ts, I assign a value to a property in onInit, and it used in html.

data:any = [];

ngOnInit() {
    this.service.getData().subscribe(res => this.data = res);
}

Any idea why ngOnInit() calls more than once?

At first, I thought it was the request interface causing this issue. However, after some attempts, I found that assigning a value to it during the lifecycle causes the problem.

Solution

  • I have resolved this issue. The reason was that I used a relative path for the img tag in the HTML, which caused the request to be redirected to the homepage on the server side. To fix this, I only needed to change the URL to an absolute path on the server side.