Repository navigation
Accessing globals from pre-rendering #253
Description
Activity
Sounds like you're trying to access
windowwhile the code is running on the server. That won't work (thewindow, the DOM, etc. only exists on the client).If you want some client-only code to access this data, wrap it in a guard clause like this, so that it doesn't throw any exception while running on the server:
if (typeof window !== 'undefined') { // your client-only logic here }If you want to share some .NET-supplied data with your server-side JavaScript code, you can pass it to the boot module using the
asp-prerender-datatag helper (see the docs under the heading Passing data from .NET code into JavaScript code here)@SteveSandersonMS Is there a way / example of making the component prerender on the server with the data passed to it from the
asp-prerender-datatag helper?At the moment I'm trying to set it from the client side using
windowin the componentsconstructor. It would probably be nicer if the component rendered onto the client side with the data already in place.Any data you pass via
asp-prerender-datawill be available to yourboot-server.tsfunction as per docs. From there, it's up to you to get it to your view components and have them use it any way you like.In Angular 2, you could use the DI system to make it available with some arbitrary key, e.g., by adding this to the
providersarray inboot-server.ts:ngCore.provide('myCustomKey', { useValue: params.data.yourValue }),... and then receiving this as a constructor parameter in a component:
constructor(@ng.Inject('myCustomKey') myValue: any) { // Do something with myVaue, e.g., prepopulate the component's data properties }You'd also have to supply some value (or null or whatever) for
myCustomKeyin the DI config in yourboot-client.tsbootstrapping code too.Hi,
We are using your template for angular2 and asp.net core.
We have tried the same thing. It's working fine and we are able to inject the data.But the issue is when the boot-client bootstraps the app it overrides the provider data injected in the constructor.
@abhilash1990 If you think you've found a problem, could you report it as a new issue? This issue was about something else and in any case is closed now :)
Hi Steve,
Can we use this for sending the Appsettings from server to client side also ?
Hi,
I've followed the steps in the documentation to put server prerendered data into an Angular 2 application.
However, even though I can see that the data is available in the window (through the console), components can't seem to access the window like in the example i.e.
window.userData. When this is attempted the application complains saying that thewindow is not defined.Are we meant to access the pre-rendered data in another way?