Using SnapEngage methods in Angular Component throws an error

Question

I am using SnapEngage widget for my application. The application has Angular Components and functions in it. I am trying to use SnapEngage methods (), but it doesnt invoke/recognize those methods. Please clarify if I should have a plugin/imports from SnapEngage. I am getting error as Cannot find name 'SnapEngage'. at the line SnapEngage.allowChatSound(true);

 includeSnapEngageWidget(){ if( SnapEngageEnabled ==="true"){ var se = document.createElement('script'); var userEmail = email; var userName = name; se.type = 'text/javascript'; se.async = true; se.src = '//storage.googleapis.com/code.snapengage.com/js/'+ widgetId +'.js'; var done = false; se.onload = (se as any).onreadystatechange = function() { if (!done&&(!this.readyState||this.readyState==='loaded'||this.readyState==='complete')) { done = true; /* Place your SnapEngage JS API code below */ SnapEngage.allowChatSound(true); } }; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(se, s); } } 

strong text

Answer 1

If your application cannot find SnapEngage that means that js file wasn't loaded. Make sure that the call to '//storage.googleapis.com/code.snapengage.com/js/'+ widgetId +'.js'; has succeeded when your application is loaded.

Answer 2

Fixed it by creating an external *.js file and its *.d.ts file, referred the *.js file path in angular.cli.JSON under scripts. The imported the function in main.ts file and called the method inside angular.