指令动态添加的输入预输入

Question

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

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

在我的应用程序中，预输入源是一个 http 调用。我在进行 http 调用的函数中放置了一些控制台日志，并且确实看到了返回的结果，所以我知道 typeahead 正在触发，但是正如您在 plunk 中看到的那样，typeahead 下拉菜单永远不会出现。我做错了什么？

注意 在 angularui 的 google 组中交叉 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" />'
  }
});