Accessing globals from boot-server prerendering #795

Closed
opened 2025-08-09 17:17:42 +00:00 by fergalmoran · 0 comments
Owner

Originally created by @abhilash1990 on 4/28/2017

Hello Steve,

I am using the Angular2Spa template and below is my boot-server.ts

import 'angular2-universal-polyfills';
import 'zone.js';
import { enableProdMode } from '@angular/core';
import { platformNodeDynamic } from 'angular2-universal';
import { AppModule } from './app/app.module';

enableProdMode();
const platform = platformNodeDynamic();

export default function (params: any): Promise<{ html: string, globals?: any }> {
return new Promise((resolve, reject) => {
const requestZone = Zone.current.fork({
name: 'angular-universal request',
properties: {
baseUrl: '/',
requestUrl: params.url,
originUrl: params.origin,
preboot: false,
// TODO: Render just the component instead of wrapping it inside an extra HTML document
// Waiting on https://github.com/angular/universal/issues/347
document: '<html><head></head></html>'
},
onHandleError: (parentZone, currentZone, targetZone, error) => {
// If any error occurs while rendering the module, reject the whole operation
reject(error);
return true;
}
});

return requestZone.run<Promise>(() => platform.serializeModule(AppModule)).then(html => {
resolve({
html: html,
globals: { myKey: params.data.myVal }
});
}, reject);
});
}

And inside the app component constructor i am trying to access like below

constructor(){
const data= (window as any).myKey;
}

Inside Index.cshtml

asp-ng2-prerender-module="ClientApp/dist/main-server"
asp-ng2-prerender-data="new { myVal = true }"

But I am getting the value as undefined.

Please suggest the steps how I can access the server side global data like appsettings in angular 2 component.

*Originally created by @abhilash1990 on 4/28/2017* Hello Steve, I am using the Angular2Spa template and below is my boot-server.ts import 'angular2-universal-polyfills'; import 'zone.js'; import { enableProdMode } from '@angular/core'; import { platformNodeDynamic } from 'angular2-universal'; import { AppModule } from './app/app.module'; enableProdMode(); const platform = platformNodeDynamic(); export default function (params: any): Promise<{ html: string, globals?: any }> { return new Promise((resolve, reject) => { const requestZone = Zone.current.fork({ name: 'angular-universal request', properties: { baseUrl: '/', requestUrl: params.url, originUrl: params.origin, preboot: false, // TODO: Render just the <app> component instead of wrapping it inside an extra HTML document // Waiting on https://github.com/angular/universal/issues/347 document: '<!DOCTYPE html><html><head></head><body><app></app></body></html>' }, onHandleError: (parentZone, currentZone, targetZone, error) => { // If any error occurs while rendering the module, reject the whole operation reject(error); return true; } }); return requestZone.run<Promise<string>>(() => platform.serializeModule(AppModule)).then(html => { resolve({ html: html, **globals: { myKey: params.data.myVal }** }); }, reject); }); } And inside the app component constructor i am trying to access like below constructor(){ **const data= (window as any).myKey;** } Inside Index.cshtml asp-ng2-prerender-module="ClientApp/dist/main-server" asp-ng2-prerender-data="new { myVal = true }" But I am getting the value as undefined. Please suggest the steps how I can access the server side global data like appsettings in angular 2 component.
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: github/JavaScriptServices#795
No description provided.