ввод с опережением ввода, динамически добавляемый директивой

У меня есть директива, которая динамически добавляет ввод в ответ на клики по контейнеру. Я хотел бы иметь возможность ввести тип для элемента директивы, который применяется к динамическому вводу. Я установил этот планк для демонстрации.

http://plnkr.co/edit/199KeGRAd32ZeOIjTKe6?p=preview

В моем приложении источником typeahead является http-вызов. Я поместил несколько журналов консоли в функцию, которая выполняет вызов http, и вижу, что возвращаются результаты, поэтому я знаю, что ввод срабатывает, но, как вы можете видеть в планке, раскрывающийся список ввода никогда не появляется. Что я делаю не так?

примечание перекрестие опубликовано в группе angularui в google


angularjs angular-ui-bootstrap angular-ui
person µBio    schedule 10.04.2013    source источник
comment
Я думаю, вам нужно исправить свой plnkr... Uncaught Error: No module: ui.bootstrap   -  person Langdon    schedule 11.04.2013
comment
ааа... плункер сбросил несколько файлов... добавлю обратно   -  person µBio    schedule 11.04.2013
comment
@Langdon Я обновил планк, спасибо   -  person µBio    schedule 11.04.2013

Ответы (2)


arrow_upward
2
arrow_downward

Я посмотрел на ваш код, но не смог заставить его работать. Вместо этого, возможно, вы могли бы использовать аналогичную функцию AngularUI. У них есть директива, основанная на плагине Select2 jQuery.

Взгляните на: http://angular-ui.github.io/#/directives-select2

И прочитайте документацию по Select2, чтобы использовать несколько значений (есть хорошая демонстрация): http://ivaynberg.github.io/select2/#multi

Я надеюсь, что это может помочь вам.

person jpmorin    schedule 11.04.2013
comment
Мы используем select2 в другом месте, мне нужно посмотреть, сможет ли он справиться со всеми нашими потребностями (включая стилизацию без редактирования js). - person µBio; 12.04.2013

arrow_upward
1
arrow_downward

Есть ли какая-то причина, по которой вам нужна сложность $compile? Директива typeahead, похоже, не позволяет вам легко передать ее, но если вы предоставите более общий источник данных, вы можете сделать это следующим образом:

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

HTML:

<test test-model="test" test-typeahead-data-source="getData()"></test>

JavaScript:

app.directive("test", function($rootScope, $compile) {
  return {
    restrict: 'E',
    scope: {
      testModel: '=',
      testTypeaheadDataSource: '='
    },
    template: '<input type="text" ng-model="testModel" typeahead="test as test.name for test in testTypeaheadDataSource" />'
  }
});
person Langdon    schedule 11.04.2013
comment
как мне прикрепить к этому обработчик события keyup? - person µBio; 12.04.2013