angularjs - 在指令中的单击事件上附加模板部分

Question

我希望能够在按钮的单击事件上多次附加模板。我设法在下面的链接功能中添加了一个 div，但我被卡住了。如何用模板替换它？

小提琴：http: //jsfiddle.net/LPUZG/1/

app.directive('clicker', function($compile) {
    'use strict';

    return {
        restrict: "A",
        replace:false,
        link: function(scope, element, attributes) {
            element.bind("click", function(e){ 
                element.parent().append('<div>hi</div>'); 
             });
         }
    }
});



<div clicker>Click me</div>

编辑：此部分包含一些表单输入字段，这些字段将由用户填写并稍后保存。

谢谢

Answer 1

在指令中指定 template 或 templateUrl 会使指令用模板的内容替换元素。所以你的点击器 div 将不再存在。

相反，您可以使用 ng-include：

<div ng-include="'partials/template.html'" ng-repeat="item in items"></div>
<!-- on click the add method adds to the items -->
<div ng-click="add()">Click Me To Add</div>