вызовите функцию jquery в angular.js

0

Я хочу использовать это меню в своем угловом приложении http://tympanus.net/Development/ResponsiveMultiLevelMenu/ Но я не сейчас, как вызвать скрипт jquery в угловом режиме, у меня есть поиск, но ничего не работает для меня. У меня есть скрипт вызова в директиве, подобный этому

appDirectives.directive('menu-directive', function() {
    return {
        restrict: 'EA',
        link: function ($scope, $elem, attrs) {
        $( '#dl-menu' ).dlmenu();
    }
    };
});

Но не работает для меня.

Оригинальный сценарий - это

<script>
            $(function() {
                $( '#dl-menu' ).dlmenu();
            });
        </script>

Любая помощь пожалуйста.

  • 0
    Как это не работает? Есть ли ошибка в консоли?
  • 0
    Там нет ошибки. но скрипт тоже не работает.
Показать ещё 2 комментария
Теги:

4 ответа

0

По умолчанию, угловая использует jQuery-версию jqlite, здесь документация вводит описание ссылки здесь

Кроме того, объект $ element, уже является объектом jquery, вы должны иметь возможность манипулировать элементом и находить дочерние узлы, нам нужно увидеть, как определяется ваше представление, чтобы увидеть, как вы можете применить свою директиву

Поделиться
0

EDIT: После ваших комментариев в ответе @CarlosMayo и в прямом демо вы опубликовали в своем ответе: http://1stfold.com/taskbox/dev/POS/angular/#/app/scan/ Кажется, вы немного запутались.

Вы реализуете свою директиву в javascript следующим образом:

.directive('menuDirective')

НЕ

.directive('menu-directive')

Но вы используете его в своей разметке, как

<menu-directive></menu-directive>

НЕ (что вы в своей демонстрации)

<menuDirective></menuDirective>

Angular преобразует camelCase в тире, разделенную строку, для использования в вашей разметке.

Как вы реализуете свою директиву? Возможно, я ошибаюсь, но думаю, что ваше имя отформатировано неправильно, поэтому ваша директива не применяется, поэтому функция ссылки не вызывается.

Я считаю, что угловой случай с верблюдом и превращает его в тире.

Попробуйте следующее:

appDirectives.directive('menuDirective', function() {
    return {
        restrict: 'EA',
        link: function ($scope, $elem, attrs) {
        $elem.dlmenu();
    }
    };
});

Тогда, на ваш взгляд

<menu-directive></menu-directive>
<!--or-->
<div menu-directive></dive>

см. скрипку: http://jsfiddle.net/mazjfjv4/1/

Поделиться
  • 0
    Нет, не работает, я применил, как вы сказали, но не вызывая сценарий.
  • 0
    appDirectives.directive ('menu-directive', function () {return {restrict: 'EA', link: function ($ scope, $ elem, attrs) {$ elem.dlmenu ();}};});
Показать ещё 6 комментариев
0

Если вы хотите выполнить функцию jQuery в элементе с директивой, которую вы должны выполнить:

link: function ($scope, $elem, attrs) {
   $elem.dlmenu();
}

EDIT: я редактировал код

Поделиться
  • 0
    Я уже проверил это, но скрипт не работает.
  • 0
    Любая ошибка в консоли? Можете ли вы предоставить JSFiddle для тестирования кода? Как сказал @Jorge, может быть, вам нужно загрузить jquery, потому что angularjs имеет облегченную версию jquery, если вы ранее не загружали полную версию jquery.
Показать ещё 25 комментариев
0

Инициализировать плагин jquery после угловой готовности.

appDirectives.directive('menu-directive', function($timeout) {
  return {
    restrict: 'EA',
    link: function ($scope, $elem, attrs) {
      $timeout(function() {
        $('#dl-menu').dlmenu();
      }, 0);
    }
  };
});
Поделиться
  • 0
    Я использовал этот код, но не для меня. скрипт не работает.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню