2016-04-20 5 views
2

Я использую daterangepicker в поле формы для отображения выбора даты. Как вы можете видеть, это прекрасно работает в поле внизу, но оно не находится в поле, которое содержится в ng-if.daterangepicker не работает внутри ng-if

http://plnkr.co/edit/WogKyUDNAVAXQTm3lOJR?p=preview

Это не daterangepicker конкретно, это верно для любых функций JQuery внутри ng-if.

Одним из решений является использование ng-show, но в этом случае оно должно быть ng-if.

+1

'ng-if' удаляет dom, если условие не выполняется. Это означает, что ваш jquery уже выполнен и элемент отсутствует. Следовательно, когда 'ng-if' оценивается как true, у вас есть только ввод текста. С другой стороны, «ng-show» - это скорее поведение show hide. Таким образом, элемент присутствует, и ваш jQuery способен его преобразовать. Кроме того, 'ng-if' означает больше манипуляций с dom из-за удаления и добавления элемента в dom. –

ответ

3

Найдено решение:

  1. Wrap функцию JQuery внутри функции $ области видимости.
  2. Вызовите функцию $ scope с помощью ng-init.

    $ scope.initializeDatepicker = function() { $ ('. Datepicker'). Daterangepicker(); };

    ng-init = "initializeDatepicker()";

+0

Рассмотрите возможность использования угловой бутстрапа https://angular-ui.github.io/bootstrap/ вместо инициализации вручную. – bnord

+0

Отличное решение, спасибо большое :) – Landeeyo

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

  • Нет связанных вопросов^_^