Question

是否可以在父指令中设置动态子指令？

在下面的示例中，我使用了元素指令，我看到了＆＃39;＆＃39;＆＃39;＆＃39;＆＃39;＆＃39;＆＃39;＆＃39;在我看来，孩子应该在哪里。

如果我使用属性指令，我会得到＆＃39;＆lt;＆gt;＆＃39;代替。

我猜这可能是一个更好的方法来解决这个问题？我基本上只是希望能够在父母的“瓷砖”中使用我想要的任何子指令。指示。

解释

  // Tile
  .directive('tile', function () {
    return {
      replace: true,
      restrict: 'E',
      scope: {
        child: '@',
        heading: '@',
        icon: '@'
      },
      templateUrl: 'templates/tile.tpl.html',
      transclude: true
    };
  })

  // Stats Table
  .directive('statsTable', function () {
    return {
      replace: true,
      restrict: 'AE',
      template: '<h1>Table</h1>',
    };
  });

标记

<tile child="stats-table" heading="Users" icon="user"></tile>

模板

<article class="tile">

  <i class="glyphicon glyphicon-{{icon}}"></i>
  <h2>{{heading}}</h2>    

  <{{child}}></{{child}}>

</article>

编辑 - 要添加的一件事：我还需要将数据传递给孩子。像这样：

<parent child-data="childData"></parent>

是否可以设置动态子指令？

0 个答案: