Угловой элемент в панели калитки

Мне снова нужна твоя помощь!

Я работаю над тем, чтобы компонент angular (ui-bootstrap-datetimepicker) загружался в компонент калитки, который загружается вне моего кода angular.

Вот как это выглядит сейчас

HTML из Wicket

<span class="dropdown">
  <a class="dropdown-toggle" role="button" data-toggle="dropdown" data-target="#" href="">
    <div class="input-append">
      <input type="text" placeholder="Date/Time Value" class="input-large" data-ng-model="data.storedValue" required date-time-input="MM/DD/YYYY hh:mm a">
      <button type="button" class="btn"><i class="icon-calendar"></i></button>
    </div>
  </a>
  <ul class="dropdown-menu">
    <datetimepicker data-ng-model="data.storedValue" data-datetimepicker-config="{ dropdownSelector: '.dropdown-toggle', minView: 'minute', minuteStep: 1 }"></datetimepicker>
  </ul>
</span>

Javascript, запускаемый для компиляции angular

var $injector = angular.injector(['app', 'ui.bootstrap']);
var selector = this.selector;
$injector.invoke(function($rootScope, $compile) {
    var element = $compile(angular.element(selector))($rootScope);
    element.scope().$apply();
    angular.element(selector).scope().$apply();
});

app - это мой модуль приложения angular.

Это эффективно отображает компонент, и появляется раскрывающийся список, но даты не заполняются. Как видно на этом изображении

Я пробовал несколько других конфигураций, но либо это усугубило ситуацию, либо совсем не помогло. Задавайте вопросы, и я отвечу как можно лучше!

Изменить. Также я получаю несколько ошибок в консоли, которые, вероятно, будут полезны: P

  • Ошибка: неизвестный поставщик: $ rootElementProvider ‹- $ rootElement‹ - $ location ‹- dropdownToggleDirective
  • Круговая зависимость: $ animator ‹- ngRepeatDirective
  • Круговая зависимость: ngShowDirective
  • Ошибка: синтаксическая ошибка: токен ',' не является основным выражением в столбце 16 выражения [changeView ('',, $ event)], начиная с [, $ event)].

person Shaded    schedule 18.10.2013    source источник


Ответы (1)


И, конечно же, сразу после того, как я опубликовал это, я понял, что делаю не так ...

Часть javascript должна была выглядеть так ...

var $injector = angular.element(document).injector();
var selector = this.selector;
$injector.invoke(function($rootScope, $compile) {
    var element = $compile(angular.element(selector))($rootScope);
    element.scope().$apply();
    angular.element(selector).scope().$apply();
});

Мне нужно было получить инжектор из основного приложения, а не создавать новое. Как только я это сделал, он смог построить календарь. Это привело к множеству других проблем, но, по крайней мере, компонент выполняет рендеринг!

person Shaded    schedule 18.10.2013