Question

我们有一个现有的插件，我们称之为

var result = $('.myElement').OurPluginName({});

我试图用Angular2指令替换它。

我的 test.ts ：

/// <reference path="test.d.ts" />
import { Directive, ElementRef, NgZone } from '@angular/core';

@Directive({
    selector: 'test'
})

export class Test {
    public ngAfterViewInit(): void {
        this.zone.runOutsideAngular(() => {
            this.OurPluginName({});
        });
    }
}

我的 test.d.ts ：

declare function OurPluginName(options: Object): void;

尽管创建了一个声明，它仍然给我一个错误：

属性＆＃39; OurPluginName＆＃39;类型＆＃39;测试＆＃39;
上不存在

解决方案：（感谢Volodymyr Bilyachat）

test.ts ：

/// <reference path="test.d.ts" />
import { Directive, ElementRef, NgZone } from '@angular/core';

@Directive({
    selector: 'test'
})

export class Test {
    public constructor(private elRef: ElementRef) {
    } 

    public ngAfterViewInit(): void {
        this.zone.runOutsideAngular(() => {
            $(this.elRef.nativeElement).OurPluginName({});
        });
    }
}

test.d.ts ：

declare var $: any;

Answer 1

您正在调用未定义的this.OurPluginName({})。

export class Test {
    public ngAfterViewInit(): void {
        this.zone.runOutsideAngular(() => {
            this.OurPluginName({}); <-- here you call for this
        });
    }
}

你应该有这样的东西：

为$添加类型定义，因为你的插件是jquery one

declare var $: any;

在类方法中定义调用

export class Test {
  constructor() {

  }

  CallOurPluginName(options) {
    $('.myElement').OurPluginName({})
  }

  public ngAfterViewInit(): void {
    this.zone.runOutsideAngular(() => {
      this.CallOurPluginName({});
    });
  }
}

PS。它不是最好的方法，但应该有效。

从Angular2

1 个答案: