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

查看:106
本文介绍了如何在Angular 4中使用jQuery插件?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想在角度项目中使用范围滑块,并且尝试使用一个可用模块处理角度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?

请让我知道.

提前谢谢!

推荐答案

是的,您可以将jQuery与Angular 4一起使用

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屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆