我制作了一个 html-renderer 指令,它接受一个字符串并将其转换为 html 元素:
.directive('htmlRenderer', function($compile) {
var linker = function(scope, element, attrs) {
scope.$watch('template', function() {
element.html(scope.template);
$compile(element.contents())(scope);
console.log("Template", scope.template);
});
};
return {
restrict: 'E',
replace: true,
link: linker,
scope: {
template: '@'
}
};
});
我的问题是在将对象作为属性传递时出现“DOM Exception 5”:
<html-rendered template='<foo x-data={{ neededData }}/>'/>
在我的控制器中,我有:
function Controller($scope) {
$scope.neededData = { text: 'Foo needs this for something' };
}
这是它的一个小提琴:http: //jsfiddle.net/9U7CJ/2/
我遇到了这个问题:Getting INVALID_CHARACTER_ERR: DOM Exception 5 这几乎意味着我做错了什么。可悲的是,我对 DOM 了解不多,所以我几乎被困住了。
我已经阅读并重新阅读了有关 $compile 和链接/编译功能的 Angular 文档,但对我来说并没有更清楚。提前致谢!:)