Как я могу использовать jQuery с Ionic 2?

Мне был предоставлен некоторый код JQuery, который мне нужно использовать с моим проектом ionic 2. Как включить его и библиотеку JQuery?

Код выглядит так (это только часть его):

// on 'Left Down' button click:
jQuery('body').on('click', '.left-down', function (e) {
  
	jQuery('body #top-scale').stop();
	jQuery('body .right-hand-weight').stop();
	jQuery('body .left-hand-weight').stop();
	//top of scale animation
	jQuery("body #top-scale").animate({
  		transform: "rotate("+ setWeights(3,0) +"deg)"
	})
	

		//===rotate + reposition each weight *** 
		jQuery("body .right-hand-weight").animate({
		 	transform:"rotate("+ getWeights() +"deg) translateX("+getX("right")+"px,"+getY("right")+"px)"
		 })

		jQuery("body .left-hand-weight").animate({
		 	transform:"rotate("+ getWeights() +"deg) translateX("+getX("left")+"px,"+getY("left")+"px)"
		 })

		//console.log(getWeights());

		// set number value in weight 
		jQuery( "body .text-1" ).text( leftWeightPercentage );

});

Ответы

Ответ 1

Обновлено: 12/04/2018

1. Прежде всего, установите jQuery в свой ионный проект:

$ npm install jquery --save

2. После этого установите глобальную иерархию jQuery на типизацию (чтобы вы могли ее импортировать):

$ npm install @types/jquery

3. Затем вы можете импортировать JQuery в страницу/компонент, где вы хотите его использовать (например: home.ts), со следующим кодом:

import * as $ from 'jquery'

И это все, теперь он должен работать.

Проверка:

Чтобы проверить, работает ли это, вы можете просто попробовать следующее:

1. В вашем компоненте/странице (например: home.html) добавьте элемент с определенным идентификатором (в данном случае: myButton) и метод:

<button id="myButton" (click)="changeTextColor()">Click Me!</button>

2. В вашем компоненте/странице: (в данном случае: home.ts) добавьте метод:

changeColor(){ $('#myButton').text('white'); }

И это должно изменить текст кнопки.