包裹在单独的指令角预输入 [英] Wrapping angular typeAhead in separate directive

问题描述

我的目标是包角UI预输入指令到轻松地重新使用的部件，可以用来这样的：

My goal was to wrap angular-ui typeAhead directive into easily re-usable component, that could be used like this:

<input my-person-lookup="myModel.personId" ></input>

我已经写我的自定义指令，并指定静态模板预输入实现这一目标。这里是 Plunker

现在，我想动态地建立这个模板，然后编译：

Now, I would like to build this template dynamically, and then compile it:

  var html = '<input type="text" ng-model="directiveModel.selectedPerson" typeahead=" p as p.name for p in people" typeahead-min-length="1" typeahead-wait-ms="200" typeahead-editable="false" placeholder="type p"></input>';
  element.replaceWith($compile(html)(scope));

不幸的是这种做法没有奏效 Plunker 。

谁能告诉我什么，我做错了吗？

Could anyone tell me what I'm doing wrong?

推荐答案

只需将数据移动到包装控制器，并删除孤立的范围。

Just move your data to the wrapping controller and remove your isolated scope.

Plunker

Plunker2

这篇关于包裹在单独的指令角预输入的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！