Get Started

inject sdk script add the following line to your src/index html before \</head> or \</body> \<script src="https //cdn jsdelivr net/npm/@letscooee/web sdk/dist/sdk min js" async>\</script> \<script> window\ cooeesdk = window\ cooeesdk || {events \[], profile \[], account \[]}; \</script> we recommend loading the sdk with the async flag so your page load times don't increase add cooee app id we recommend that you store the app id in your environment files for that, you can add cooeeappid in all your environment ts files export const environment = { production false, cooeeappid 'my cooee app id', }; replace my cooee app id with the app id which is present at cooee portal after you are done with testing, since the sdk should only collect analytics in your production website, we recommend that you remove cooeeappid value from environment ts and only add to your environment prod ts file add cooeeservice in your angular project, add this generic service src/services/cooee service ts import {injectable, ngzone} from '@angular/core'; import {observable, replaysubject} from 'rxjs'; import {environment} from ' / /environments/environment'; // eslint disable next line @typescript eslint/naming convention declare let cooeesdk { events any\[], account any\[], profile any\[], screen any\[] }; @injectable({ providedin 'root', }) export class cooeeservice { private readonly oncta$ = new replaysubject\<record\<string, any>>(0); constructor( private readonly ngzone ngzone, ) { } init() void { if (!this isavailable()) { return; } cooeesdk account push({appid environment cooeeappid}); document addeventlistener('oncooeecta', (event event) => { this ngzone run(() => { // @ts ignore this oncta$ next(event detail); }); }, false); } oncta() observable\<record\<string, any>> { return this oncta$ asobservable(); } setprofile(data record\<string, any>) void { if (!this isavailable()) { return; } cooeesdk profile push(data); } trackpageview(screenname string) void { if (!this isavailable()) { return; } cooeesdk screen push(screenname); } trackevent(name string, props? record\<string, any>) void { if (!this isavailable()) { return; } cooeesdk events push(\[name, props]); } private isavailable() boolean { return !((typeof cooeesdk) === 'undefined'); } } this is a generic example of using cooee in your angular application now, in your app component ts (or somewhere in any global code), initialize the service import {component} from '@angular/core'; import {cooeeservice} from ' /services/cooee service'; @component({ selector 'app root', templateurl ' /app component html', styleurls \[' /app component scss'], }) export class appcomponent { constructor(private readonly cooeeservice cooeeservice) { this cooeeservice init(); } }