这可能是由于Angular服务端渲染不支持动态添加的内容导致的。为了解决这个问题,可以在组件中使用“TransferState”来传递动态内容。
首先,在服务端代码中导入TransferState和BrowserTransferStateModule:
import { TransferState, StateKey, makeStateKey } from '@angular/platform-browser';
import { BrowserTransferStateModule } from '@angular/platform-browser';
然后,在组件中注入TransferState:
constructor(private transferState: TransferState){}
接下来,通过TransferState将动态内容传递给浏览器:
this.transferState.set(key, dynamicContent);
最后,将动态内容在浏览器中获取:
static get(key: StateKey, defaultValue: any = undefined): any {
const value = TransferStateModule.injector.get(TransferState).get(key, defaultValue);
TransferStateModule.injector.get(TransferState).remove(key);
return value;
}
使用此方法,可以在服务端渲染时将动态内容传递给浏览器,并在页面源代码中显示出来。