angular自定义指令
1.在directive文件下创建指令的js文件
通常自定义指令需要声明模块(注意定义指令时, js内部指令名称需采用 aaAaBb驼峰的命名方式 html中使用的是aa-aa-bb)
e.g
(function(){ "use strict"; var nvsAutoRefresh = function (){ return{ controller:function($scope,$interval,$timeout,$translate ){ //auto refesh var autoRefresh; $scope.changeTimeRefesh = function(){ $interval.cancel(autoRefresh); if ($scope.intervalTime > 0) { autoRefresh = $interval(function() { var timeDistance = $scope.toDate - $scope.fromDate; $scope.tDateRange = angular.copy(new Date()); $scope.fDateRange = angular.copy(new Date($scope.tDateRange.getTime() - timeDistance)); $scope.fromDate = $scope.fDateRange.getTime(); $scope.toDate = $scope.tDateRange.getTime(); $timeout(function() { $scope.refreshPage(); }) }, $scope.intervalTime * 1000); } } }, restrict:'E', templateUrl: 'src/common/directive/nvs-auto-refresh/nvs-auto-refresh.html' }; } angular.module('nvs-auto-refresh',[]) .directive('nvsAutoRefresh',nvsAutoRefresh); })();
其中templateUrl引用的文件目录如下
2.指令创建后,在需要的template中加入指令,(注意指令定义的restrict的注入方式,以及指令名称格式的变化)
3.在app.js中注入指令所在的模块 ,还有index.html中 引入指令对应的js文件