Using JSNLog with Angular 2

Question

I am having trouble getting JsNlog to work with Angular 2 (latest full release). I installed JsNlog into my project (empty client web application in Visual Studio 2015) via npm and then set it up in a service but I get the error "XHR error (403 Forbidden) loading" when trying to use one of the methods. Please can anyone tell me what I am doing wrong?

Below is the code:

My Service:

import { Injectable, Component } from '@angular/core';
import JL from 'jsnlog';

@Injectable()

export class JSLoggerService
{
 constructor()
 {
 }

log(msg: string)
{
    JL('Angular').trace(msg);
}

debug(msg: string)
{
    JL('Angular').debug(msg);
}

info(msg: string)
{
    JL('Angular').info(msg);
}

warn(msg: string)
{
    JL('Angular').warn(msg);
}

error(msg: string)
{
     JL('Angular').error(msg);
}
}

In a component (just parts relevant to jsnlog):

import { JSLoggerService } from './shared/services/jslogger.service';

export class AppComponent
{
    constructor(private _jsnlog: JSLoggerService)
    {
      _jsnlog.log("hi");
    }
}

Systemjs.config.js (just parts relevant to jsnlog):

          map: {
             'jsnlog': 'npm:jsnlog'
         }

package.json (just parts relevant to jsnlog):

          dependencies: {
             'jsnlog': '2.20.1'
         }

app.module.ts (just parts relevant to jsnlog):

          import { JSLoggerService } from './shared/services/jslogger.service';

@NgModule({
providers: [
    JSLoggerService
],
bootstrap:[ AppComponent]
})

Answer 1

I am the author of JSNLog. I finally got round to adding a page to jsnlog.com describing how to add JSNLog to an Angular 2+ app: http://jsnlog.com/Documentation/HowTo/Angular2Logging