2015-08-23 2 views
4

В моем проекте я использую jQuery и угловой. Я установил их через bower, и я использую браузер для загрузки файлов. Кажется, что это работает нормально, кроме углового используется jqLite. Когда я пытаюсь запуститьКак сделать угловое использование jQuery над jqLite

angular.element(".workItem").hide(); 

Я получаю сообщение об ошибке: jqLite не поддерживает селектора запросов. Как я могу обойти это и сделать угловое использование jQuery?

Я хочу использовать angular.element над $ для целей тестирования.

Спасибо!

ответ

4

От docs:

Чтобы использовать JQuery, просто убедитесь, что он загружен до angular.js файла.

Так что в вашем файле index.html, вы хотите что-то вроде этого:

<html> 
    <head> 
    <script src='jquery.js'></script> 
    <script src='angular.js'></script> 
    </head> 
</html> 

После этого, angular.element должен работать в качестве замены для $:

Если JQuery доступен , angular.element - это псевдоним для функции jQuery. Если jQuery недоступен, angular.element делегирует встроенное подмножество Angular в jQuery, называемое «jQuery lite» или «jqLite».

Т.е. angular.element('.foo') будет таким же, как $('.foo').

+3

Это будет работать, если я загружаю файлы через index.html, но я пользуюсь браузером, и я сначала загружаю jQuery, но он все еще пытается использовать jqLite –

+0

Можете ли вы проверить вкладку «Сеть», чтобы убедиться что jQuery загружается первым? Или, альтернативно, попробуйте бросить некоторые «console.logs». Если он действительно загружается первым, у вас не должно быть проблем. Я никогда не пользовался браузером, но похоже, что он полезен для ситуаций, когда вещи имеют странные зависимости, и вы хотите отменить обработку этого. Поскольку вы знаете, что всегда будете хотеть jQuery и Angular в этом порядке, почему бы не добавить их в 'index.html'? –

+0

@AdamZerner При использовании браузера все зависимости объединяются в один JS-файл вместе и (в оптимальном случае), который не отображается как глобальные, а 'require()' d. – felixfbecker

1

Для сделать его работу с browserify вы должны требовать его: Добавьте зависимость Jquery к Бауэр и сделать в главном файле:

require('jquery'); 
global.jQuery = require('jquery'); 
global.$ = jQuery; 

До здесь, не виден на browserify, поскольку речь идет только в беседке. Так что используйте browserify-подкладку, чтобы клей:

  • Установите browserify-регулировочная шайба
  • В вашем package.json добавить:
"browserify": { 
    "transform": [ 
    "browserify-shim" 
    ] 
}, 
    "browser": { 
    "jquery": "./bower_components/jquery/dist/jquery.js" 

См https://github.com/thlorenz/browserify-shim для получения полной информации.

+0

Используя браузеру через gulp, я смог заставить его работать, просто добавив 'global.jQuery = require ('jquery');' в мой основной файл. Нет * браузера-прокладки * требуется. – lebolo