<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> </head> <body> <div ng-app="myApp"> <div ng-controller="firstController"> <custom-tags>原始数据</custom-tags> </div> </div> <script type="text/javascript" src="../../vendor/angular/angularjs.js"></script> <script type="text/javascript" src="app/index.js"></script> </body> </html>
var myApp = angular.module(‘myApp‘,[]) .directive(‘customTags‘,function () { return{ restrict: ‘ECAM‘, template: ‘<div>新数据 <span ng-transclude></span></div>‘, replace: true, transclude: true } }) .controller(‘firstController‘,[‘$scope‘,function ($scope) { $scope.name = ‘Alrale‘; }]);
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> </head> <body> <div ng-app="myApp"> <div ng-controller="firstController"> <custom-tags>原始数据</custom-tags> <div custom-tags2 custom-tags3></div> </div> </div> <script type="text/javascript" src="../../vendor/angular/angularjs.js"></script> <script type="text/javascript" src="app/index.js"></script> </body> </html>
var myApp = angular.module(‘myApp‘,[]) .directive(‘customTags‘,function () { return{ restrict: ‘ECAM‘, template: ‘<div>新数据 <span ng-transclude></span></div>‘, replace: true, transclude: true } }) .directive(‘customTags2‘,function () { return{ restrict: ‘ECAM‘, template: ‘<div>2</div>‘, replace: true, priority: -1 } }) .directive(‘customTags3‘,function () { return{ restrict: ‘ECAM‘, template: ‘<div>3</div>‘, replace: true, priority: 0, //小于 0 的 directive 都不会执行 //terminal: true } }) .controller(‘firstController‘,[‘$scope‘,function ($scope) { $scope.name = ‘Alrale‘; }]);
Angularjs[27] - 自定义指令(3)(transclude, priority, terminal 属性)
原文:http://www.cnblogs.com/bky-1083/p/6361639.html