如何在 Angular 4 中使用 jQuery 插件? [英] How to use jQuery Plugin with Angular 4?

问题描述

我想在 angular 项目中使用范围滑块，并且我尝试使用一个可用的 angular 4 模块.

I want to use a range slider in an angular project and I tried using one available module for angular 4.

它在编译期间工作正常，但是当我尝试构建它以进行部署时，它会引发以下错误.

It works fine during compilation but when I try to build it for deployment, it throws the below error.

我检查了在 angular 项目中直接使用 jQuery 插件的选项，但我只获得了在 Angular 2 中执行此操作的选项.

I checked for the option of using jQuery plugin directly in the angular project and I'm only getting options for doing it in Angular 2.

我们可以在 Angular 4 中使用 jQuery 插件吗?

Is there any way we can use jQuery plugins in Angular 4?

请告诉我.

提前致谢！

推荐答案

是的，您可以在 Angular 4 中使用 jquery

Yes you can use jquery with Angular 4

步骤:

1) 在 index.html 中，在标签的下方放置一行.

1) In index.html put below line in tag.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

2) 在下面的组件 ts 文件中，你必须像这样声明 var

2) In component ts file below you have to declare var like this

import { Component } from '@angular/core';
declare var jquery:any;
declare var $ :any;

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'angular 4 with jquery';
  toggleTitle(){
    $('.title').slideToggle(); //
  }

}

并将此代码用于相应的 html 文件，如下所示:

And use this code for corresponding html file like this:

<h1 class="title" style="display:none">
  {{title}}
</h1>
<button (click)="toggleTitle()"> clickhere</button>

这对你有用.谢谢

这篇关于如何在 Angular 4 中使用 jQuery 插件?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！