Angular 2/4 和 jquery 脚本答案

【问题标题】：Angular 2/4 and jquery scriptsAngular 2/4 和 jquery 脚本
【发布时间】：2017-10-08 19:32:15
【问题描述】：

我已将jQuery 添加到我的angular 4 项目中，但我在使用旨在使用jQuery 的脚本时遇到问题。

jQuery 安装为 npm 包，然后使用 typings 命令通过 angulars cli 添加

我想访问我的compontents.ts 文件中的那些jQuery 脚本。

有问题的脚本是：this

【问题讨论】：

标签： jquery angular typescript

【解决方案1】：

在您的 angular-cli.json 中：

"scripts": [
  "../node_modules/jquery/dist/jquery.min.js"
],

在你的组件中：

import * as $ from 'jquery';

【讨论】：

对不起，但正如问题中的状态，我已经通过打字实现了 jQuery，我所追求的是如何为 jQuery（滚动框）实现插件，所以我可以调用 @987654323 @根据滚动条github上的示例
所以通常情况下，我写的东西是有效的。 $("#demo") 将起作用。我在我的项目中这样做。
我知道`$("#demo")` 有效，但我需要最后一部分 .scrollbox() 才能工作。
它不适用于 import * as scrollbox from 'jquery.scrollbar' ？
它没有，因此我在这里问，但是我不明白为什么当我从字面上询问如何添加 jQuery 脚本/插件时人们告诉我如何设置 jQuery >

【解决方案2】：

在您的组件中，您必须像这样为 jquery 选择器声明一个全局变量：

import ... 

declare var $: any;

@Component({
 ...
}) 
export class ANY_CLASS implements OnInit{
   ngOnInit() {
     $('#demo').scrollbox();
  }
//use it as you like after that
}

在你的模板中：

<div id="demo" class="scroll-text">
  <ul>
    <li>item 1</li>
    <li>item 2</li>
    <li>item 3</li>
  </ul>
</div>

【讨论】：