码迷,mamicode.com
首页 > 其他好文 > 详细

angular transclude服务、函数、指令

时间:2017-09-25 21:57:22      阅读:150      评论:0      收藏:0      [点我收藏+]

标签:blog   images   image   back   log   rect   body   rip   元素   

$transclude服务

transclude函数

ng-transclude指令

可实现子元素嵌入到模板中,需要在DDO中开启 transclude: true 

<body ng-app="app">
<dx>
    这是内层
</dx>
</body>
<script>
    var app = angular.module(app,[]);
    app.directive(dx,function(){
        return {
            template:`<div>
                        这是外层
                            <div ng-transclude></div>
                      </div>`,
            transclude:true
        }
    });
</script>

运行效果:

技术分享

可见,被嵌入的元素还能拥有自己独立的作用域

补充:如果以上例子中打开replace:true,则运行效果如下

技术分享

angular transclude服务、函数、指令

标签:blog   images   image   back   log   rect   body   rip   元素   

原文地址:http://www.cnblogs.com/hellohello/p/7593845.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!