本人初学者,如有不足虚心求教!
angular指令的模块可以分下面几个部分:
- restrict:用于操作dom的[E]元素,[A]属性,[C]样式,同时也能组合使用
- priority:设置当前指令的优先级,用于同一个页面下面调用不同指令的时候
- replace:用于替换dom元素
- template:定义指令模版
- templateUrl:用url的加载方式加载模版
- controller:在指令中添加控制器,可以用自己$scope的作用域
- link:用于绑定dom元素事件的,可以设置数据绑定
下面一个简单的例子:
angular.module('expanderModule', []) .directive('expander', function(){ return { restrict: 'EA', replace: true, transclude: true, scope: { title:'=expanderTitle' }, template: '<div>' + '<div class="title" ng-click="toggle()">{{title}}</div>' + '<div class="body" ng-show="showMe" ng-transclude></div>' + '</div>', link: function(scope, element, attrs) { scope.showMe = false; scope.toggle = function toggle() { scope.showMe = !scope.showMe; } } } });