在角2（角-CLI）使用香草js代码(Using vanilla js code in Angula

我想实现的香草倾斜JS插件在我的项目，但我甚至不能似乎找到使用香草JS进口在我的项目的一种方式。

到目前为止，我一直在使用它作为指令试过了，就像你会使用使用jQuery插件ElementRef ， Input等来自@angular/core 。

我已经包含在我的脚本.angular-cli.json下文件scripts:直接从NPM包 ，我已经安装了香草倾斜JS。

我想使用它作为一个指令，因为它有自己data-tilt属性，就像这样：

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

@Directive({
    selector: '[data-tilt]'
})
export class ParallaxDirective {
    constructor(private el: ElementRef) {

    }
}

但我不能找到一个方法来做到这一点，尽管到目前为止，我的努力。 我是新来的角2。

我的问题是：

是否有可能使用普通javasciprt插件里面角2，如果可能的话，我怎么能实现香草倾斜JS插件？

Answer 1:

您应该能够导入Vinilla倾斜，并使用传递到构造元素的参考。

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

const VanillaTilt = require('vanilla-tilt');

@Directive({
    selector: '[data-tilt]'
})
export class ParallaxDirective {
    constructor(private el: ElementRef) {
      VanillaTilt.init(el.nativeElement, {
        max: 25,
        speed: 400
      });
    }
}

文章来源: Using vanilla js code in Angular 2 (angular-cli)