Angular.Dart 中 ngTransclude 的模拟 [英] Analog of ngTransclude in Angular.Dart

问题描述

我想弄清楚如何使组件呈现其子项.

所以我可以编译:

<div id="孩子"></div></my-component>

变成这样:

<!-- 一些组件的东西--><div id="孩子"></div>

Angular.Dart 中是否有类似 ngTransclude 的东西?

解决方案

AngularDart 使用 Shadow DOM 代替 ngTransclude.这是我们通过新兴网络标准将 Angular 推入浏览器的方式之一.

添加 标签而不是组件的模板将导致子元素放置在那里.

例如在您的示例中， 的模板可能如下所示:

<!-- 一些组件的东西--><内容></内容>

为了更加精彩，您还可以使用 Shadow DOM 的内容选择器来控制显示哪些子元素.

I'm trying to figure out how to make a component render its children.

So I can compile:

<my-component>
  <div id="child"></div>
</my-component>

into something like this:

<div id="parent">
  <!-- some component stuff -->
  <div id="child"></div>
</div>

Is there something like ngTransclude in Angular.Dart?

解决方案

AngularDart uses Shadow DOM in place of ngTransclude. This is one of the ways we are pushing Angular into the browser with emerging web standards.

Adding a <content> tag instead your component's template will cause the child element to be placed there.

e.g. in your example <my-component>'s template might look like:

<div id="parent">
  <!-- some component stuff -->
  <content></content>
</div>

For even more awesomeness, you can use Shadow DOM's content selectors as well to control which child elements are displayed.

这篇关于Angular.Dart 中 ngTransclude 的模拟的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！