1.指令html模板

<md-input-container class="wrap-auto-refresh"><label>{{'sscTimeRangePicker.refreshEvery' | translate}}</label><md-select  style="width: 100px" ng-model="intervalTime"  ng-change="changeTimeRefesh()" auto-id="refresh_interval_time"><md-option value="0"  auto-id="refresh_off"><span translate="sscTimeRangePicker.off">OFF</span></md-option><md-option value="5" auto-id="refresh_5_secs">5 <span translate="sscTimeRangePicker.sec">Sec</span></md-option><md-option value="15"  auto-id="refresh_15_secs">15 <span translate="sscTimeRangePicker.sec">Sec</span></md-option><md-option value="20" auto-id="refresh_20_secs">20<span translate="sscTimeRangePicker.sec">Sec</span></md-option><md-option value="30" auto-id="refresh_30_secs">30<span translate="sscTimeRangePicker.sec">Sec</span></md-option></md-select>
</md-input-container>

 

2.指令内容 (主要操作为将该控件的的时间保存到本地localstoryeg

(function(){"use strict";var nvsAutoRefresh   = function  (){return{controller:function($scope,$interval,$timeout,localStorageService){//auto refeshvar   autoRefresh;(function(){if(!localStorageService.get("autoRefreshTime")){$scope.intervalTime = 15;localStorageService.set("autoRefreshTime",$scope.intervalTime);console.log(localStorageService.get("autoRefreshTime"));}else{$scope.intervalTime =  localStorageService.get("autoRefreshTime");console.log(localStorageService.get("autoRefreshTime"));}})();$scope.changeTimeRefesh = function(){var intervalValue = $scope.intervalTime;console.log("间隔间隔intervalValue"+intervalValue);if(intervalValue == "0"){if(!localStorageService.get("autoRefreshTime")){console.log("定时刷新已关闭");}else{localStorageService.set("autoRefreshTime",intervalValue);}}else {localStorageService.set("autoRefreshTime",intervalValue);}}// $scope.$watch(function () {//     return $state.current.name;//     console.log($state.current.name);// },function(newVal, oldVal){//     console.log("lalalal" + newVal,oldVal);//     if( newVal =="activeAlarms"|| newVal =="historicalAlarms"){//         $interval.cancel(autoRefresh);////         $scope.refreshPage();////     }else{//         $interval.cancel(autoRefresh);//     }//// });
},restrict:'E',templateUrl: 'src/common/directive/nvs-auto-refresh/nvs-auto-refresh.html'};}angular.module('nvs-auto-refresh',[]).directive('nvsAutoRefresh',nvsAutoRefresh);})();

 

 3.在用到该控件的的地方  写入下方法

 var autoFresh = function () {var timeRange = Number(localStorageService.get("autoRefreshTime"));console.log("timeRange   eeeeeeeeeee"+timeRange);var autoRefresh;if(timeRange > 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();})}, timeRange * 1000);}$scope.$on("$destroy", function() {    //离开页面时相关操作
                    $interval.cancel(autoRefresh);})};autoFresh();

指令使用需要在index引入指令的js文件  在总moudel加入依赖