TypeError: Cannot call method 'insertBefore' of null on $compile

Question

我正在尝试构建递归指令。

看起来像这样：

var theTemplate = 
        '<span>{</span>' + 
            '<div>'+
                '<p>{{argVal}}</p>' +
                '<custom-args arg-val="argVal[0]"></custom-args>' +
            '</div>';

    return {
        restrict: "E",
        scope: {
            argVal: '='
        },
        controller: function($scope){
            //just some utilities
        },
        link: function(scope, element){
            element.html('').append(theTemplate);
            $compile(element.contents())(scope);
        }
    };

问题是，当我运行它时，我得到：

Angularjs: TypeError: Cannot call method 'insertBefore' of null

有什么问题？

Answer 1

问题在于

            element.html('').append(theTemplate);
            $compile(element.contents())(scope);

而不是将模板附加到空白 HTML，我需要像这样直接将它附加到 HTML

            element.html(theTemplate);
            $compile(element.contents())(scope);

现在可以了！

TypeError: Cannot call method 'insertBefore' of null on $compile

TypeError: Cannot call method 'insertBefore' of null on $compile

angularjs

angular-directive