在 Angular 2 / typescript 中声明 javascript 方法以避免属性 x 不存在错误

Question

我在 Angular 2、TypeScript 项目中使用了一些 JavaScript。例如，我使用具有 javascript 文件和一些如下所示的方法的 MixPanel：

mixpanel.people.set({
    "$first_name": "Joe",
    "$last_name": "Doe",
    "$created": "2013-04-01T09:02:00",
    "$email": "joe.doe@example.com"
});

还有这个：

   mixpanel.track("Video played", {
        "Video length": 213,
        "id": "hY7gQr0"
    });

调用此方法有效，但 typescript 找不到此 mixpanel 对象的任何定义，因此会抛出错误。这是有问题的，因为我无法编译这些错误...

因此，我使用这个小技巧来声明混合面板，如下所示：

import { Injectable } from '@angular/core';

declare var mixpanel: {
  track(event: string, data: any): void;
  identify(data: any): void;
  people(data: any): void;
  track_links(domQuery: string, eventName: string, properties: any): void;
};

@Injectable()
export class MixPanelService {

  constructor() { }

  public track(event: string, data: any) {
    mixpanel.track(event, data);
  }

  public track_links(domQuery: string, eventName: string, properties: any) {
    mixpanel.track_links(domQuery, eventName, properties);
  }

  public identify(id: string) {

    mixpanel.people.set({ <---- ERROR: Property 'set' does not exist on type '(data: any) => void'.at line 37 col 21
      '$first_name': id
    });
    mixpanel.identify(id);

  }
}

我声明 mixpanel.people，但不是 mixpanel.people.set。这会导致错误。

有人知道我应该如何声明 mixpanel var 来解决这个问题吗？或者有没有更好的解决办法？

Answer 1

为 MixPanel 创建自己的 class，例如：

export class MixPanel
{
    track(event: string, data: any): void
    {
    }

    identify(data: any): void
    {
    }
    ...
}

Answer 2

declare var mixpanel:any;

可以解决你所有的问题；

在 Angular 2 / typescript 中声明 javascript 方法以避免 属性 x 不存在错误

declare javascript methods in Angular 2 / typescript to avoid propery x does not exist errors

javascript

declare

mixpanel

typescript

angular

在 Angular 2 / typescript 中声明 javascript 方法以避免属性 x 不存在错误