<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>自定义指令2</title>
<link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.css">
</head>
<body ng-app="demoApp">
<div breadcrumb></div>
<breadcrumb data=""></breadcrumb>
<script src="bower_components/angular/angular.js"></script>
<script>
var demoApp = angular.module('demoApp', []);
// demoApp.directive('btn', [function(){
// return {
// scope:{
// primay:'@',
// lg:'@',
// block:'@',
// },
// template:'<button class="btn {{primary==\'true\'?\'btn-primary\':\'\'}}">button</button>'
// }
// }]);
// demoApp.directive('btn',[function(){
// return{
// //指令对象的transclude必须设置为true才可以在模板中使用ng-transclude指令
// transclude:true,
// replace:true, //替换指令在html中绑定的元素
// template:'<button class="btn btn-primary btn-lg" ng-transclude></button>'
// };
// }]);
demoApp.directive('breadcrumb', [function(){
return {
restrict: 'EA',
// E = Element, A = Attribute, C = Class, M = Comment
// template: '',
templateUrl: 'templ/breadcrumb.html',
replace: true,
// transclude: true,
};
}]);
</script>
</body>
</html>
自定义指令2
最新推荐文章于 2023-01-04 22:19:39 发布