2016-11-17 3 views
5

В учебнике я следовал, используется JQuery внутри папки типизации используетсяИспользование JQuery с угловыми 2

/// <reference path="../typings/tsd.d.ts" />

внутри app.component, но не работает.

Пробовал импортировать библиотеку в сторону index.html через CDN, затем использовать declare var $: any; до сих пор не работает

Установленные JQuery через НПМ и его путь внутри system.config.ts как следующий

paths: { 
    // paths serve as alias 
    'npm:': 'node_modules/', 
    'jquery:': 'node_modules/jquery/dist/jquery.slim.min.js' 
}, 

еще никакой подсказки

Update:

Теперь я установил угловой с помощью угловой -cli. У меня ошибка 404, но приложение все еще не работает. Предполагаются выводить KeyUp в консоли

https://plnkr.co/edit/8HW67qLUF3t8zmTigXH6?p=preview 
+3

Почему вы хотите это сделать? :) –

+0

Какая функциональность вы после jQuery? – Sami

+0

Вы можете просто добавить импорт в свой индекс.html', а затем 'import {window} из '@ angular/platform-browser/src/facade/browser';' и вызывать 'window. $' в вашем угловом. –

ответ

1

Jquery является удивительным, когда вы просто хотите сделать простую манипуляцию DOM, я чувствую его один из главных недостатков для углового, простого DOM доступа в одной строке будет Великий. Вот иди. Загрузите Jquery в файл index.html. Также вам нужно включить файл определений, чтобы заставить функции JQuery работать внутри функций машинописного текста.

<script type="text/javascript" src="/assets/jquery-3.1.1.min.js" async></script> 
+0

Что вы подразумеваете под «вам нужно включить файл определений, чтобы заставить функции JQuery работать внутри функций машинописного текста». @Пэдди? – minhnguyen

5

Вы упомянули вы были только с помощью учебника, поэтому, не прилагается к SystemJS конфиг себя.

Если вы используете Angular CLI вместо (моя личная рекомендация), вы можете сделать это следующим образом:

Установить JQuery, фактическую библиотеку

 
npm install jquery --save 

Установить JQuery машинопись автозаполнения

 
npm install @types/jquery --save-dev 

Затем перейдите в файл ./angular-cli.json в корне вашей папки проекта «Угловые CLI» и найдите scripts: [] свойства, добавьте это в нем:

 
"../node_modules/jquery/dist/jquery.min.js" 

(или использовать версию slim, если это ваша чашка чая, держите остальную часть пути, как есть)

После того, JQuery будет доступен вы как глобальная переменная. Вы можете зарегистрировать jQuery.fn.jquery (который приносит версию jQuery), чтобы обеспечить блестящую работу.

P.S.

Если вы хотите напрямую использовать Webpack или gulp, нам нужно увидеть образец вашего конфигурационного файла или какое семя проекта вы использовали для создания проекта (применительно к проектам Webpack и Gulp).

+1

Спасибо, что освободили это для Углового CLI! –

Смежные вопросы