首先,在浏览器上安装Mixpanel。这一点非常重要。
npm install --save mixpanel-browser
安装相应的类型定义文件:
npm install --save @types/mixpanel
在index.html中添加您的跟踪脚本,
但不要包括
mixpanel.init()
。
<!-- start Mixpanel -->
<script type="text/javascript">
(function(e,b){if(!b.__SV){var a,f,i,g;window.mixpanel=b;b._i=[];b.init=function(a,e,d){function f(b,h){var a=h.split(".");2==a.length&&(b=b[a[0]],h=a[1]);b[h]=function(){b.push([h].concat(Array.prototype.slice.call(arguments,0)))}}var c=b;"undefined"!==typeof d?c=b[d]=[]:d="mixpanel";c.people=c.people||[];c.toString=function(b){var a="mixpanel";"mixpanel"!==d&&(a+="."+d);b||(a+=" (stub)");return a};c.people.toString=function(){return c.toString(1)+".people (stub)"};i="disable time_event track track_pageview track_links track_forms register register_once alias unregister identify name_tag set_config people.set people.set_once people.increment people.append people.union people.track_charge people.clear_charges people.delete_user".split(" ");
for(g=0;g<i.length;g++)f(c,i[g]);b._i.push([a,e,d])};b.__SV=1.2;a=e.createElement("script");a.type="text/javascript";a.async=!0;a.src="undefined"!==typeof MIXPANEL_CUSTOM_LIB_URL?MIXPANEL_CUSTOM_LIB_URL:"file:"===e.location.protocol&&"//cdn.mxpnl.com/libs/mixpanel-2-latest.min.js".match(/^\/\//)?"https://cdn.mxpnl.com/libs/mixpanel-2-latest.min.js":"//cdn.mxpnl.com/libs/mixpanel-2-latest.min.js";f=e.getElementsByTagName("script")[0];f.parentNode.insertBefore(a,f)}})(document,window.mixpanel||[]);
</script>
我强烈推荐你创建自己的服务,这可以非常简单:
import { Injectable } from '@angular/core';
import * as mixpanel from 'mixpanel-browser';
@Injectable({
providedIn: 'root'
})
export class MixpanelService {
init(userToken: string): void {
mixpanel.init('your-project-token');
mixpanel.identify(userToken);
}
track(id: string, action: any = {}): void {
mixpanel.track(id, action);
}
}
注意,我从我的userAuthService中调用init()函数,但你可以做任何你想做的事情。只要确保在开始跟踪之前调用init()函数。
然后,从你的代码的其余部分,你可以使用:
constructor(private mixpanelService: MixpanelService) { }
someFunction() {
this.mixpanelService.track('Some action', {
customPropertyOne: 'customValueOne',
customPropertyTwo: 'customValueTwo'
});
}
import * as mixpanel from 'mixpanel-browser';
我收到了一个错误,指出:无法找到'mixpanel-browser'模块的声明文件。
我已经通过npm安装了mixpanel-browser和@types/mixpanel。另外,在您的最后一个函数中,您应该调用“push”而不是“track”,因为我没有看到“track”的定义? - OHope