transclude 嵌入

1.transclude

指的是定义模版的元素如何处理问题。在使用它的时候,需要在两个地方说明,一是在指令中说明需要嵌入,二是在模版中说明嵌入到哪里。

我们可以将整个模板,包括其中的指令通过嵌入全部传入一个指令中。这样做可以将任意内 容和作用域传递给指令。transclude参数就是用来实现这个目的的,指令的内部可以访问外部 指令的作用域,并且模板也可以访问外部的作用域对象。

元素部分:

<body>
    <hello>12345678</hello>
</body>

js部分:

var myModule = angular.module('myModule',[]);
myModule.directive('hello',function(){
    return {
        restrict:'E',
        template:'<div>Hi everyone!<span ng-transclude></span></div>',
        replace:true,
        transclude: true
    }
})

输出:

<div>Hi everyone!
  <span ng-transclude="">
    <span class="ng-scope">12345678</span>
  </span> </div>

 

posted @ 2015-10-27 14:44  简惬  阅读(232)  评论(0编辑  收藏  举报