首页 >web前端 >js教程 >如何将后端渲染的参数传递给 Angular2 Bootstrap 方法?

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

Barbara Streisand
Barbara Streisand原创
2024-12-11 02:03:14979浏览

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中文网其他相关文章!

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn