包裹在单独的指令角预输入(Wrapping angular typeAhead in separat

我的目标是包角UI预输入指令到易于重复使用的部件，可以用来这样的：

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

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

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

  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 。

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

Answer 1:

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

Plunker

Plunker2

文章来源: Wrapping angular typeAhead in separate directive