转换嵌套指令会呈现两次

Question

我创建了两个指令，一个用于简单的文本输入框（apt-field），一个用于带有tabbed-view的引导面板（apt-panel-with-tab）。

以下是Plunker链接： http://plnkr.co/edit/CsxOWGXVzkQugdmpdMyl

在代码中，您将看到我单独使用了apt-field，并且在apt-panel-with-tab指令中使用了apt-field指令，其中apt-field指令被渲染两次。

我已经尝试了Angular 1.4.8和1.5.0-rc.0以及相同的结果。

有没有人知道我做错了什么？或者这可能是AngularJS中的错误？

PS： SO不允许我在没有附带代码的情况下放入plunker链接，所以这里是plunker网站上可用代码的一部分：

app.directive('aptField', [
  function() {
    var directiveObject = {
      restrict: 'E',
      compile: function(elem, attrs) {
        var tpl = null;
        var bindTo = null;
        if (attrs.field) {
          bindTo = 'formData.' + attrs.field;
          if (angular.isDefined(attrs.modelBase)) {
            bindTo = attrs.modelBase + '.' + attrs.field;
            if (bindTo.indexOf('.') == 0) {
              bindTo = bindTo.substr(1);
            }
          }
        }
        var control = {
          tag: 'input',
          attrs: {
            type: 'text',
            class: 'form-control'
          },
          selfClose: true,
          formify: true
        };
        var tpl = '<' + control.tag;
        for (var attr in control.attrs) {
          tpl += ' ' + attr + '="' + control.attrs[attr] + '"';
        }
        tpl += control.selfClose ? ' />' : '></' + control.tag + '>';
        var $tpl = angular.element(tpl);
        if (bindTo) {
          $tpl.attr('data-ng-model', bindTo);
        }
        elem.append($tpl);
      }
    };
    return directiveObject;
  }
]);

感谢。