如何使用TypeScript在Angular 2中的hammer.js中初始化和设置选项

我想在我的Angular应用程序中使用hammer.js。我成功安装了jquery，但是我对这一切都很陌生，我不知道如何处理更复杂的需要设置选项的东西。我被困在获得一个hammerjs对象，我可以在它制作后进行操作。根据文档，建议在初始化后设置选项。如何使用TypeScript在Angular 2中的hammer.js中初始化和设置选项

这里是我做过什么至今：

我安装hammerjs和锤timejs与NPM。

我导入我的组件是这样的：

import 'hammerjs'; 
import 'hammer-timejs';

一些的index.html显示什么我尝试锤重视：

<body> 
    <div id="main"> 
     <app-root></app-root> 
    </div> 
</body>

难道我只是做文档说什么安装和设置选项？喜欢这个？

let hammertime = new Hammer(
    document.getElementById('main') 
); 
hammertime.get('swipe').set({ threshold: 100 });

我是否必须在ngOnInit或其他钩子中执行此操作？

如果我想为整个应用程序安装hammer.js，如何定义myElement？只是普通的JS？

document.getElementById('main')

还是有更好的Angular方式？

来源

2017-07-04 Jerry Huckins

人，但你知道什么是myElement。请提供http://stackoverflow.com/help/mcve – estus

我现在要解决这个问题，谢谢。 –

通常，你不应该在子组件的父元素上操作，这是jQuery的习惯，而不是一个好的。有什么可以阻止你在app-root上做到这一点吗？ – estus

Angular应用程序仅适用于自我或子元素。

组件元素本身可以ElementRef解决：

private hammerManager; 

constructor(private elementRef: ElementRef) {} 

ngOnInit() { 
    this.hammerManager = new Hammer(this.elementRef.nativeElement); 
    this.hammerManager.get('swipe').set({ threshold: 100 }); 
} 

ngOnDestroy() { 
    this.hammerManager.destroy(); 
}

来源

2017-07-05 14:10:11 estus

如何使用TypeScript在Angular 2中的hammer.js中初始化和设置选项

回答

相关问题