angular2 - user active and idle

Question

I want to logout (or warn the user) when my user is idle after a period of time in my app. I am using localStroage provider in order to know if my user is logged in or not. I found this question and answer AngularJS $idleProvider and $keepaliveProvider in Angular2 but couldn't find a way to use those solutions. There is no ngZone.onTurnDone and but when I use the ng2-idle I get

Error: SyntaxError: Unexpected token <
at Object.eval (http://127.0.0.1:8080/node_modules/ng2-idle/core.js:12:14)
at eval (http://127.0.0.1:8080/node_modules/ng2-idle/core.js:33:4)
Evaluating http://127.0.0.1:8080/src/@angular/core
Evaluating http://127.0.0.1:8080/node_modules/ng2-idle/core.js
Error loading http://127.0.0.1:8080/src/app/main.js

if you have any idea for me for how can I find out if my user is idle it will be great. Thanks a lot

How do you configure ng2-idle? Thanks! – Thierry Templier Jun 01 '16 at 12:36 — Thierry Templier, Jun 01 '16 at 12:36

score 3 · Accepted Answer · answered Jun 01 '16 at 12:41

You need to be aware that ng2-idle leverages Angular2 RC versions and there are module name updates between Beta and RC versions.

Your error occurs on the following line in the library (file core.js):

var core_1 = require('@angular/core');

Here is the configuration in such a case:

System.config({
  map: {
    'ng2-idle': 'node_modules/ng2-idle'
  },
  packages: {
    app: {
      main: './main.ts',
      defaultExtension: 'ts'
    },
    '@angular/core': {
      main: 'core.umd.js',
      defaultExtension: 'js'
    },
    '@angular/compiler': {
      main: 'compiler.umd.js',
      defaultExtension: 'js'
    },
    '@angular/common': {
      main: 'common.umd.js',
      defaultExtension: 'js'
    },
    '@angular/platform-browser-dynamic': {
      main: 'platform-browser-dynamic.umd.js',
      defaultExtension: 'js'
    },
    '@angular/platform-browser': {
      main: 'platform-browser.umd.js',
      defaultExtension: 'js'
    },
    '@angular/http': {
      main: 'http.umd.js',
      defaultExtension: 'js'
    },
    rxjs: {
      defaultExtension: 'js'
    }
    'ng2-idle': {
      defaultExtension: 'js'
    }
  }
});

It almost fixed my problem :). my angular version didn't like the syntax of: exports.IDLE_PROVIDERS = [simpleexpiry_1.SimpleExpiry, core_1.provide(idleexpiry_1.IdleExpiry, { useExisting: simpleexpiry_1.SimpleExpiry }), idle_1.Idle]; ib ng2-idle/core.js So I had to change that a bit. Do you know something about that? anyway your suggestion really made the difference and it is working for me now. Thanks a lot — Noa, Jun 02 '16 at 11:37

angular2 - user active and idle

1 Answers1