Dom 将非字符串属性传递给$compile函数

我制作了一个html呈现器指令，它接受字符串并将其转换为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异常5”：

在我的控制器中，我有：

function Controller($scope) {
  $scope.neededData = { text: 'Foo needs this for something' };
}

这里有一把小提琴：

我遇到了这个问题： 这就意味着我做错了什么。可悲的是，我对多姆苏知之甚少，我几乎被卡住了

---

我已经阅读并重读了$compile的Angular文档，以及关于链接/编译函数的内容，但对我来说还没有变得更清楚。提前感谢！：）

可以尝试先对其进行jsonize:

$scope.neededData=angular.toJson（{text:'Foo….}）

？你知道有ngBindTemplate，对吧。顺便说一句，你有太多的单曲引用，因此你的错误你能发布Plunker或Fiddle吗？@Cherniv-但它已经是JSON了，除非有一些我不知道的幕后魔法正在发生of@Utopik-是的，我在angular docs中看到了这一点，但我真的不明白如何/何时使用它。（我的角度知识在1-10的范围内大约为4°）。是的，更新了代码：）