Javascript 如何在Angular2中使用jQuery插件？

我正试图在我的一个Angular2项目中使用Packey。然而，我似乎无法让它在指令中工作。这是我的packer.directive.ts文件

/// <reference path="../../../typings/packery/packery.d.ts" />

import { Directive, ElementRef } from '@angular/core';

@Directive({
  selector: '[packery]'
})

export class Packery {

  constructor(el: ElementRef) {
    jQuery(el.nativeElement).packery({
      itemSelector: '.grid-item',
      gutter: 10
    });
  }
}

但是，有了这些选项，我会得到一个错误

Supplied parameters do not match any signature of call target.

打字文件已将类型声明为可选类型

declare module "packery" {
interface PackeryOptions {
    itemSelector?: string;
    gutter?: number;
......................

---

如果有人能引导我正确地在TypeScript中实现jQuery插件，我将不胜感激。谢谢。

您可能需要导入它或检查版本兼容性：

从常见问题解答：

Angular是否使用jQuery库

是的，Angular可以使用jQuery，如果它在应用程序引导时出现在应用程序中。如果您的脚本路径中没有jQuery，Angular将返回到它自己的jQuery子集实现，我们称之为jQLite

Angular 1.3仅支持jQuery 2.1或更高版本。jQuery1.7及更新版本可以正确地使用Angular，但我们不能保证这一点

---

我终于设法解决了它使用的解决方案张贴在

我当前的指令代码

import { Directive, ElementRef, Inject, OnInit } from '@angular/core';

declare var jQuery: any;

@Directive({
  selector: '[packery]'
})

export class Packery implements OnInit {
  elementRef: ElementRef;

  constructor( @Inject(ElementRef) elementRef: ElementRef) {
    this.elementRef = elementRef;
  }


  ngOnInit() {
    jQuery(this.elementRef.nativeElement).packery({
      // options
      itemSelector: '.grid-item',
      gutter: 10
    });
  }

}

---

那是给安格拉尔的。我已经让jQuery工作了。只是插件没有。尝试将初始化从构造函数移动到ngAfterViewInit hookNope。仍然不起作用。同样的错误。

import { Directive, ElementRef, Inject, OnInit } from '@angular/core';

declare var jQuery: any;

@Directive({
  selector: '[packery]'
})

export class Packery implements OnInit {
  elementRef: ElementRef;

  constructor( @Inject(ElementRef) elementRef: ElementRef) {
    this.elementRef = elementRef;
  }


  ngOnInit() {
    jQuery(this.elementRef.nativeElement).packery({
      // options
      itemSelector: '.grid-item',
      gutter: 10
    });
  }

}