Question

我正在使用看起来像这样的Angular指令：

<parent>
    <children></children>
    <children></children>
    <children></children>
</parent>

父指令有一个

template: return "<div><ul></ul><div ng-transclude></div></div>"

儿童指令将进入ng-transclude div。

我的最终HTML结构是

<newParent>
    <div ng-transclude>
        <child></child>
        <child></child>
        <child></child>
    </div>
</newParent>

我想知道是否可以删除ng-transclude div，以便新孩子成为新父母的直接子女。（我有更多的孩子，随机数＆gt; 1）。

我必须这样做以匹配现有模板，因此我无法更改其结构。

如果您需要更多信息，我实际上没有小提琴。谢谢！

Answer 1

您可以使用transclude功能自行附加内容，而不使用ng-transclude：

app.directive("parent", function($compile) {
  return {
    restrict: "EA",
    transclude: true,
    link: function(scope, element, attrs, ctrls, $transclude) {

      $transclude(function(clone, scope) {
        element.append(clone);
      });
    }
  };
});

以下是有关Transclusion的更多信息。

如果没有模板，这会将transcluded元素添加为指令的子元素。使用该模板，您需要自行正确放置（例如，在<div>之后将其插入<ul>内容。

角度指令儿童没有转移父母

1 个答案: