具有角度cli的同位素v2

Shy*_*har 1 npm isotope angular2-modules angular

我正在使用带有角度cli的同位素布局模块来解决问题

我用
npm install isotope-layout --save 安装了模块

我在.angular-cli.json文件中添加了脚本

"scripts": [ 
    ...
    "../node_modules/isotope-layout/dist/isotope.pkgd.js"
  ],
Run Code Online (Sandbox Code Playgroud)

以及package.json中的依赖性

 "dependencies": {
    ..
    "zone.js": "^0.8.4",
    "isotope-layout": "^3.0.2"
 }
Run Code Online (Sandbox Code Playgroud)

但如果我打电话给我的组件

ngOnInit() { $('.grid').isotope(); }
Run Code Online (Sandbox Code Playgroud)

但我有一个错误

Property 'isotope' does not exist on type 'jQuery<HTMLElement>'
Run Code Online (Sandbox Code Playgroud)

如何在我的模块中使用此库?
我试着用它导入它

import isotope from 'isotope-layout';
Run Code Online (Sandbox Code Playgroud)

但我有错误"找不到模块"

任何人都可以向我解释如何在角度cli中使用角度模块?我很困惑..

ps_如果通过控制台我输入$('.grid').isotope();它的工作..

Lud*_*wig 5

install命令和cli配置看起来正确.

我想首先你必须通过添加一个类型定义来使'Isotope'可见.

declare var Isotope: any;
Run Code Online (Sandbox Code Playgroud)

您可以在typings.d.ts文件中或直接在component.ts文件中执行此操作.然后您可以在代码中使用它,即单击按钮时.

sortButtonClick(){

  let grid = document.querySelector('.grid');
  let iso = new Isotope(grid, {
      sortBy: 'random'
    }
  );
}
Run Code Online (Sandbox Code Playgroud)