How to access global js variable in angular2 component

Question

I have a global js variable defined below (@Url is an ASP.Net MVC html helper it will get converted to a string value):

<script>
  var rootVar = '@Url.Action("Index","Home",new { Area = ""}, null)';
  System.import('app').catch(function(err){ console.error(err); });
</script>

How do I access rootVar in an angular2 component? I used to use the window service in angular 1.5, is there an analogous way of doing that in angular2?

Specifically, I want to use that rootVar variable to help generate the templateUrl in this component:

import { Component, Inject} from '@angular/core';

@Component({
    selector: 'home-comp',
    templateUrl: '../Home/Root'
})

export class HomeComponent {   
    constructor( ) {  }
}

Answer 1

Within your component you could reference window to access the global variables like so:

rootVar = window["rootVar"];

or

let rootVar = window["rootVar"];

Answer 2

You need to update the file that bootstraps your application to export a function:

import {bootstrap} from '...';
import {provide} from '...';
import {AppComponent} from '...';

export function main(rootVar) {
  bootstrap(AppComponent, [
    provide('rootVar', { useValue: rootVar })
  ]);
}

Now you can provide the variable from the index.html file this way:

<script>
  var rootVar = '@Url.Action("Index","Home",new { Area = ""}, null)';
  System.import('app/main').then((module) => {
    module.main(rootVar);
  });
</script>

Then you can inject the rootVar into components and services this way:

import { Component, Inject} from '@angular/core';

@Component({
  selector: 'home-comp',
  templateUrl: '../Home/Root'
})
export class HomeComponent {   
  constructor(@Inject('rootVar') rootVar:string ) {  }
}

Answer 3

In the component file, outside component class definition, declare rootVar, and it will become available in the component constructor:

declare var rootVar: any;

then

@Component(...)
export class MyComponent {
  private a: any;

  constructor() {
    this.a = rootVar;
  }
}