I would like to add this utility to the Angular app but having a hard time with it. <a class="postlink" href="http://keenthemes.com/metronic/preview/?page=components/utils/session-timeout&demo=default">http://keenthemes.com/metronic/preview/ ... mo=default</a>
I wanted to add this to the header.component.ts file
sessionTimeout() : void{
$.sessionTimeout({
title: 'Session Timeout Notification',
message: 'Your session is about to expire.',
keepAliveUrl: AppConsts.remoteServiceBaseUrl + 'KeepAlive',
logoutUrl: this.logout(),
warnAfter: 3000, //warn after 5 seconds
redirAfter: 35000, //redirect after 10 secons,
ignoreUserActivity: true,
countdownMessage: 'Redirecting in {timer} seconds.',
countdownBar: true
});
};
I also tried something like this private _$sessionTimeout: JQuery;
sessionTimeout() : void{
this._$sessionTimeout.sessionTimeout({
title: 'Session Timeout Notification',
message: 'Your session is about to expire.',
keepAliveUrl: AppConsts.remoteServiceBaseUrl + 'KeepAlive',
logoutUrl: this.logout(),
warnAfter: 3000, //warn after 5 seconds
redirAfter: 35000, //redirect after 10 secons,
ignoreUserActivity: true,
countdownMessage: 'Redirecting in {timer} seconds.',
countdownBar: true
});
};
I also added this "./assets/metronic/src/vendors/bootstrap-session-timeout/dist/bootstrap-session-timeout.js" to the .angular-cli.json file but the $.sessionTimeout() function cannot be found in the header.component.ts file.
This is the error I am getting. ERROR TypeError: Cannot read property 'sessionTimeout' of undefined at HeaderComponent.sessionTimeout (header.component.ts:304) at HeaderComponent.ngOnInit (header.component.ts:122) at checkAndUpdateDirectiveInline (core.js:12400) at checkAndUpdateNodeInline (core.js:13927) at checkAndUpdateNode (core.js:13870) at debugCheckAndUpdateNode (core.js:14763) at debugCheckDirectivesFn (core.js:14704) at Object.eval [as updateDirectives] (AppComponent.html:3) at Object.debugUpdateDirectives [as updateDirectives] (core.js:14689) at checkAndUpdateView (core.js:13836)
Can anyone help me with what I am doing wrong?
4 Answer(s)
-
0
did you add it in typings.d.ts? if not you need to add
you can read the related doc <a class="postlink" href="https://aspnetzero.com/Documents/Developing-Step-By-Step-Angular">https://aspnetzero.com/Documents/Develo ... ep-Angular</a>
this is the repo of the session timeout library <a class="postlink" href="https://github.com/orangehill/bootstrap-session-timeout">https://github.com/orangehill/bootstrap-session-timeout</a>
-
0
Yes I did, I tried it two different ways since I am not 100% sure how the typings.d.ts actually works.
I tried it this way.
interface JQuery { sessionTimeout(...any): any; }
and this way...
declare var sessionTimeout: any; //related to session timeout
But still the same error.
-
0
Can you try this ?
interface JQuery { sessionTimeout(...args: any[]): any; }
-
0
Unfortunately that didn't work either.
I think I might try something like this since it was made for Angular <a class="postlink" href="https://www.npmjs.com/package/@ng-idle/core">https://www.npmjs.com/package/@ng-idle/core</a>