Accessing globals from pre-rendering #253

Activity

1. SteveSandersonMS commented on Aug 15, 2016

   

   SteveSandersonMS

   on Aug 15, 2016

   Member

   More actions

   Sounds like you're trying to access window while the code is running on the server. That won't work (the window, 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-data tag helper (see the docs under the heading Passing data from .NET code into JavaScript code here)
2. SteveSandersonMS

   closed this as completedon Aug 15, 2016
3. danjford commented on Aug 16, 2016

   

   danjford

   on Aug 16, 2016

   Last edited by danjford

   Author

   More actions

   @SteveSandersonMS Is there a way / example of making the component prerender on the server with the data passed to it from the asp-prerender-data tag helper?

   At the moment I'm trying to set it from the client side using window in the components constructor. It would probably be nicer if the component rendered onto the client side with the data already in place.
4. SteveSandersonMS commented on Aug 16, 2016

   

   SteveSandersonMS

   on Aug 16, 2016

   Last edited by SteveSandersonMS

   Member

   More actions

   Any data you pass via asp-prerender-data will be available to your boot-server.ts function 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 providers array in boot-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 myCustomKey in the DI config in your boot-client.ts bootstrapping code too.
5. abhilash1990 commented on Oct 19, 2016

   

   abhilash1990

   on Oct 19, 2016

   More actions

   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.
6. SteveSandersonMS commented on Oct 24, 2016

   

   SteveSandersonMS

   on Oct 24, 2016

   Member

   More actions

   @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 :)
7. jain1anuj commented on May 3, 2017

   

   jain1anuj

   on May 3, 2017

   More actions

   Hi Steve,

   Can we use this for sending the Appsettings from server to client side also ?