动态地添加角度指令和模板

Question

来自Stackoverflow的人，

我有以下指令：

app.directive("newcard", function() {
   return{
      restrict: 'E',
      scope: {},
      replace: true,
      templateUrl: '*templateUrl*',
      link : function ($scope) {
         scope.cardId = numberOfCards;
      }
   };
})

但是当我用动态添加它时：

$('.tree-cards').append('<newcard></newcard>');

它添加的只是一个空标记。 有没有办法用模板的内容替换它？

Answer 1

愚蠢的我，我试图使用$ compile，但担心它没有用。原来我必须在正确的地方注入编译的依赖性。

在每种情况下，这对我有用：

var divElement = angular.element(document.querySelector('.tree-cards'));
var appendHtml = $compile('<newcard></newcard>')($scope);
divElement.append(appendHtml);