以下是一个使用Angular Universal Transfer State API的代码示例:
app.server.module.ts
的文件,并添加以下代码:import { NgModule } from '@angular/core';
import { ServerTransferStateModule } from '@angular/platform-server';
@NgModule({
imports: [
ServerTransferStateModule // 导入ServerTransferStateModule模块
]
})
export class AppServerModule { }
TransferState
和makeStateKey
:import { TransferState, makeStateKey } from '@angular/platform-browser';
TransferState
:constructor(private transferState: TransferState) { }
makeStateKey
创建一个状态密钥:const MY_DATA_KEY = makeStateKey('myData');
TransferState
的set
方法将数据存储在状态中:this.transferState.set(MY_DATA_KEY, '这是我的数据');
TransferState
的get
方法从状态中获取数据:const myData = this.transferState.get(MY_DATA_KEY, '');
console.log(myData); // 输出:这是我的数据
通过以上步骤,你就可以在服务端和客户端之间传递数据并确保在客户端渲染时使用服务端的数据来避免重复请求。