如何在AngularJS中使用动态模板创建指令？

Question

如何使用动态模板创建指令？

'use strict';

app.directive('ngFormField', function($compile) {
return {
    transclude: true,
    scope: {
        label: '@'
    },
    template: '<label for="user_email">{{label}}</label>',
    // append
    replace: true,
    // attribute restriction
    restrict: 'E',
    // linking method
    link: function($scope, element, attrs) {
        switch (attrs['type']) {
            case "text":
                // append input field to "template"
            case "select":
                // append select dropdown to "template"
        }
    }
  }
});



<ng-form-field label="First Name" type="text"></ng-form-field>

这就是我现在所拥有的，它可以正确显示标签。但是，我不确定如何在模板上附加其他HTML。或将2个模板合并为1个。

Answer 1

有类似的需求。$compile做这份工作。（不完全确定这是否是“ THE”方法，仍然可以通过角度进行工作）

http://jsbin.com/ebuhuv/7/edit-我的探索测试。

需要注意的一件事（以我的示例为例），我的要求之一是，type一旦单击“保存”，模板将根据属性进行更改，并且模板非常不同。因此，尽管如此，您获得了数据绑定，如果在那里需要新的模板，则必须重新编译。