angularjs 当transclude:true or elemet时如何在link函数中取得要替代模板中ng-transclude的那部分内容
来源:互联网 发布:软件开发面试项目 编辑:程序博客网 时间:2024/05/15 23:52
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="bootstrap.min.css">
<script src="jquery.min.js"></script>
<script src="angular.js"></script>
<script src="bootstrap.min.js"></script>
<script type="text/javascript">
var app = angular.module('myapp', []);
app.directive('cust', function(){
return {
restrict: 'EA',
transclude: true,
replace: true,
link: function(scope, elem, attrs, ctrl, transclude) {
transclude(scope, function(clone) {
console.log(clone);
});
},
template:"<span ng-transclude></span>"
}
});
</script>
<style type="text/css">
</style>
</head>
<body ng-app="myapp">
<cust><div>hello</div></cust>
</body>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="bootstrap.min.css">
<script src="jquery.min.js"></script>
<script src="angular.js"></script>
<script src="bootstrap.min.js"></script>
<script type="text/javascript">
var app = angular.module('myapp', []);
app.directive('cust', function(){
return {
restrict: 'EA',
transclude: true,
replace: true,
link: function(scope, elem, attrs, ctrl, transclude) {
transclude(scope, function(clone) {
console.log(clone);
});
},
template:"<span ng-transclude></span>"
}
});
</script>
<style type="text/css">
</style>
</head>
<body ng-app="myapp">
<cust><div>hello</div></cust>
</body>
</html>
可以看到link函数的第五个参数是一个函数,它的第二个参数也是一个函数,其中clone就是那部分要被嵌入template中的内容<div>hello</div>.
0 0
- angularjs 当transclude:true or elemet时如何在link函数中取得要替代模板中ng-transclude的那部分内容
- angularjs中的transclude参数的理解($tranclude服务以及compile中transclude)
- angular指令的transclude选项以及ng-transclude指令
- angularJs中自定义指令transclude与templateUrl详解
- angularjs指令:replace与transclude的区别
- AngularJs directive-transclude
- angularjs指令:transclude
- 如何在ng-if中取得ng-model的值
- AngularJs在ng-click函数中如何获取代表当前元素的DOM对象
- AngularJs在ng-click函数中如何获取代表当前元素的DOM对象
- angularjs指令中的replace与transclude参数
- angularJS 自定义指令 属性:transclude、priority、terminal
- angularjs指令中的replace与transclude参数
- AngularJS ng-repeat嵌套循环中,如何取得外层循环的索引值
- angularJS学习之路(二十)---自定义指令---transclude的作用
- 创建自定义 AngularJS 指令:Part 4 transclude和restrict介绍
- 详解angularjs指令中的replace与transclude参数
- AngularJS自定义指令之transclude解析与实例演示
- 利用openssl管理证书及SSL编程第3部分:将MinGW编译的openssl dll导出def和lib供MSVC使用
- Mac系统MySQL安装、设置及卸载
- 架构之美
- 发布或重启线上服务时抖动问题解决方案
- RHEL6.3 yum源更新
- angularjs 当transclude:true or elemet时如何在link函数中取得要替代模板中ng-transclude的那部分内容
- Week7-2POS tagging
- solr hightlight高亮显示
- Maven常用命令
- 智能设备相关Arduino+esp8266 +阿里云eds + 百度云推动 流程 简约 配置指南
- JAVA图形界面(GUI)之常用组件
- Android 图表开源库 GraphView
- 缓存文件可以放在哪里?它们各自的特点是什么?
- js常用数组方法