Question

我有一个指令，可以动态添加输入以响应容器上的点击。我希望能够将一个typeahead放在应用于动态输入的指令元素上。我已经设置了这个插件来演示。

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

在我的应用中，预先输入源是一个http调用。我在调用http调用的函数中放了一些控制台日志并看到结果返回，所以我知道typeahead正在触发，但正如你在plunk中看到的那样，从未出现过类型下拉。我做错了什么？

注意在angularui的谷歌小组上交叉posted

Answer 1

我查看了你的代码，但我无法使其工作。相反，也许你可以使用AngularUI的类似功能。他们有基于Select2 jQuery插件的指令。

查看：http://angular-ui.github.io/#/directives-select2

阅读Select2文档以使用多值（有一个很好的演示）： http://ivaynberg.github.io/select2/#multi

我希望它可以帮到你。

Answer 2

是否有某些原因需要$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" />'
  }
});

通过指令动态添加输入的typeahead

2 个答案: