放置在另一个指令link()方法中的指令不会呈现

时间:2013-08-26 00:54:45

标签: javascript angularjs

我正在学习有棱有角,并且在理解了指令中的范围,我开始变得更加......大胆,我会说。我想渲染一个嵌套在另一个表的单元格中的表,其中两个表都由两个具有不同作用域的独立指令生成。 这是小提琴:
http://jsfiddle.net/jared_t83/Y8LjY/
这是有问题的链接方法:

link: function($scope, element, attrs) {
  $scope.property = "scopingTest2.link() - won't overwrite parent"
  var html = element.html(),
    text = [
      'scopingtest2 - new scope, prototipically inherited from the parent',
      '<table>',
      '<tr><th>key</th><th>value</th></tr>',
      '<tr>',
      '<td>Nested table should be here: <br><div scoping-test1></div></td>',
      '</tr>',
      '<tr>',
      '<td>$scope.property</td>',
      '<td>', $scope.property, '</td>',
      '</tr><tr>',
      '<td> $scope.$parent.property </td>',
      '<td>', $scope.$parent.property, '</td>',
      '</tr><tr>',
      '<td> $scope.__proto__.property</td>',
      '<td>', $scope.__proto__.property, '</td>',
      '</tr></table><br>'
    ]
  element.html(html + text.join(''));
}

应该呈现嵌套表的行是:

      '<tr>',
      '<td>Nested table should be here: <br><div scoping-test1></div></td>',
      '</tr>',

但相反,渲染表我看到上面的文字。
我究竟做错了什么?如何实现我想要的? 我很感激你的时间,
问候
贾里德

1 个答案:

答案 0 :(得分:0)

好的,我现在明白了。

element.html(html + text.join(''));

是一个jqLit​​e函数,它只是将传递的文本放在目标元素上。 为了做我想做的事情,我需要使用angular指令的'template:'属性 傻我:)。