我如何使用transclusion在angularjs？ [英] How do I use transclusion in angularjs?

问题描述

在约翰·林德奎斯特教程，transclusion是用来抓住从指令一些内容，并把它放在一个想要的位置。

In the John Lindquist tutorial, transclusion is used to grab some content from the directive and put it in a desired place.

但该文档谈translude功能，并将其传递给控制器​​和编译功能。那么，什么是transclusion以及如何使用它？

But the docs talk about translude function and passing it to controller and compile function. So, what is transclusion and how do I use it?

推荐答案

在创建基本指令，transclusion很简单：

When creating a basic directive, transclusion is easy:

module.directive( 'myTransDir', function () {
  return {
    transclude: true,
    scope: true,
    replace: true,
    template: '<div><h1>Hello!</h1><div ng-transclude></div></div>',
  };
});

由于模板包含 ngTransclude 指令，它会自动transclude的内容对我来说。如果我用这样的：

Because the template includes the ngTransclude directive, it will automatically transclude the contents for me. If I use it like this:

<div my-trans-dir>
  <p>Some Content</p>
</div>

生成的HTML将是：

The resultant HTML will be:

<div>
  <h1>Hello!</h1>
  <div>
    <p>Some Content</p>
  </div>
</div>

这篇关于我如何使用transclusion在angularjs？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！