标签:引入 IV idt fresh 刷新 input NPU || 自动
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 refesh var 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加入依赖
标签:引入 IV idt fresh 刷新 input NPU || 自动
原文地址:https://www.cnblogs.com/RonnieQin/p/9168401.html