如何将后端渲染的参数传递给 Angular2 Bootstrap 方法？-js教程-PHP中文网

如何将后端渲染的参数传递给 Angular2 Bootstrap 方法？

Barbara Streisand

发布： 2024-12-11 02:03:14

原创

1024 人浏览过

How Can I Pass Backend-Rendered Parameters to the Angular2 Bootstrap Method?

将后端渲染的参数传递给 Angular2 引导方法

要将后端渲染的参数传递给 Angular2 引导方法，请利用 Angular 的依赖注入能力。以下是如何实现它：

var headers = ... // Retrieve headers from the server

bootstrap(AppComponent, [{ provide: 'headers', useValue: headers }]);

登录后复制

这种方法允许您将这些参数注入到 Angular 组件或服务中：

class SomeComponentOrService {
   constructor(@Inject('headers') private headers) {}
}

登录后复制

或者，您可以直接提供准备好的 BaseRequestOptions，如下所示：

class MyRequestOptions extends BaseRequestOptions {
  constructor(private headers) {
    super();
  }
} 

var values = ... // Fetch headers from the server
var headers = new MyRequestOptions(values);

bootstrap(AppComponent, [{ provide: BaseRequestOptions, useValue: headers }]);

登录后复制

使用此方法，您可以通过注入在 Angular 应用程序中使用这些标头直接使用 BaseRequestOptions：

class ConfigService {
  constructor(private http: Http, @Inject(BaseRequestOptions) private baseRequestOptions) { }
}

登录后复制

注意：对于 AoT 编译，请将工厂闭包移到类之外：

function loadContext(context: ContextService) {
  return () => context.load();
}

登录后复制

以及 NgModule 内：

@NgModule({
  ...
  providers: [ ..., ContextService, { provide: APP_INITIALIZER, useFactory: loadContext, deps: [ContextService], multi: true } ],

For cyclic dependency issues, inject the Injector and retrieve the dependency:

登录后复制

this.myDep = jector.get(MyDependency);

Instead of directly injecting `MyDependency`:

登录后复制

@Injectable()
导出类 ConfigService {
私有路由器:Router;
构造函数(/私有路由器:Router>/ 喷油器:喷油器) {

setTimeout(() => this.router = injector.get(Router));

登录后复制

}
}

以上是如何将后端渲染的参数传递给 Angular2 Bootstrap 方法？的详细内容。更多信息请关注PHP中文网其他相关文章！