Question

我是以编程方式创建AngularJS指令，但我注意到这样做时，模板/范围编译会引发错误。

当指令存在于html页面中时，以下工作正常：

    dialogs.directive('workRequestDialog', function() {
        return {
            template: '<div>{{test}}</div>',
            restrict: 'A',
            controller: ['$scope', '$element', '$attrs', function($scope, $element, $attrs) {
                $scope.test = 'it worked';
            }]
        };
    });

打印<div>it worked</div>

直接创建和附加元素：

// Create DOM element
var div = document.createElement('div');
div.setAttribute(userOptions.type, '');
div.setAttribute('class', 'panel modal ' + userOptions.type);

// Pass along configuration options, if any
var dialogScope = userOptions.options || {};

dialogScope.test = 'it works'; // even trying this fails

// Create directive
var dialog = angular.element(div);
var el = $compile(dialog)(dialogScope);
angular.element(document.body).append(dialog);

导致此错误：

TypeError: undefined is not a function
    at textInterpolateLinkFn (/assets/dist/libs/angular/angular.js:7016:23)

Answer 1

在您的代码中，dialogScope似乎不是范围，尤其是userOptions.options未定义时。尝试传递当前范围。如果您在编写此代码时没有可用的范围，那么它就不在正确的位置。

模板标签在编程构建的指令中导致“未定义不是函数”

1 个答案: