0

I'm using Angular 4 and Zopim. In the index.html the Zopim is loaded - works great. If I load the page I can in the Chrome console write

$zopim.livechat.getName()

and then get the name of the current user. However, I would like to set the name in the Typescript file.

My problem here is that I don't understand how I can execute the jQuery in Typescript without installing any npm jQuery stuff. I've read other posts like: Can TypeScript interact with jQuery without a definition file? which suggests to use 

declare var $;

I've tried this but get the error that $zopim is not defined.

Is it possible, and if yes - how can I set the name in Zopim from Typescript? Zopim API documentation:

$zopim(function() {
 $zopim.livechat.setName('Logged in name');
 $zopim.livechat.setEmail('user@somewhere.com');
});

Thanks!

mr3k
  • 188
  • 3
  • 17

2 Answers2

1

$ is an alias for jQuery, so by declaring $ you can use jquery functions $('test'), $.fn. ...

Here it looks like you need to define $zopim

declare var $zopim : any;


onInit()
{
$zopim(function() {
 $zopim.livechat.setName('Logged in name');
 $zopim.livechat.setEmail('user@somewhere.com');
});
}
David
  • 33,444
  • 11
  • 80
  • 118
  • Thanks for the answer! When I do this and then add $zopim.livechat.getName(); in ngOnInit - I get this error: "ERROR TypeError: Cannot read property 'getName' of undefined" – mr3k Feb 06 '18 at 14:37
  • Hm, strange. If I do this: this.liveChat = $zopim.livechat; it works great. But I still can't call this.liveChat.getName() or this.liveChat.setName() - then I get this "undefined" – mr3k Feb 06 '18 at 14:43
  • Maybe the chat is not initialised at this point. It's hard to tell as I don't know zopim. Did you make sure to use it in the $zopim function? See post edit – David Feb 06 '18 at 14:56
  • This works great. I skipped the "$zopim(function()" .. Thanks! :) – mr3k Feb 06 '18 at 15:11
0

Run npm install jquery --save Add js/css files in scripts or styles of angular-cli.json like

"scripts": ["../node_modules/path to file", "./assets/path to file"]

For library supported @types/, just run npm install @types/jquery --save-dev

To use the library, add declare var jQuery: any; declare var $zopim : any;before annotation @Directive or @Component want to use the lib

santosh singh
  • 27,666
  • 26
  • 83
  • 129