我的 $interval 服务和 Angualr.js 中的路由有问题我想导航抛出页面,我不想丢失另一个页面上的资料......我会解释......我m 使用库 chart.js 生成一个简单的折线图。然后我每 5 秒生成一些资料,并将这些资料推送到帮助我构建图表的阵列中(如果你知道这个库,你就知道我在说什么)。当我进入另一个页面并回传时图表消失了,资料全部消失了,它从零开始。我能做什么?这是我的代码...
$(function(){
var myWallet = 1000000000;
var BTCWallet = 0;
var ETHWallet = 0;
var CROWallet = 0;
var app = angular.module("myApp", ["ngRoute","chart.js"]);
/**roting dell'app */
app.config(function($routeProvider,$locationProvider) {
$locationProvider.hashPrefix('');
$routeProvider
.when("/dashboard", {
templateUrl : "dashboard.html"
})
.when("/wallet", {
templateUrl : "wallet.html"
})
.when("/trading", {
templateUrl : "trading.html"
})
.when("/home", {
templateUrl : "home.html"
})
;
});
/**controller per il timer nella dashboard
*/
app.controller('countCtrl', function($scope, $interval){
$scope.theTimer = 5;
var stopTimer = $interval(()=>{
$scope.theTimer = $scope.theTimer -1;
if ($scope.theTimer == 0){
$scope.theTimer = $scope.theTimer 5;
}
},1000);
$scope.$on('$destroy', function() {
$interval.cancel(stopTimer);
});
});
/**
* Chat setup and options
*/
app.controller("chartCtrl", function($rootScope,$scope,$interval){
$scope.labels = [];
$scope.series = ['BTC', 'ETH' , 'CRO'];
$scope.data = [
[],[],[]
];
var stopChart = $interval(()=>{
console.log($scope.data[0].push($rootScope.BTCCoin *1));
console.log($scope.data[0]);
$scope.data[1].push($rootScope.ETHCoin *1);
$scope.data[1];
$scope.data[2].push($rootScope.CROCoin *1);
$scope.data[2];
$scope.ora = new Date();
var orario = $scope.ora.toLocaleTimeString();
console.log($scope.labels.push(orario));
console.log($scope.labels);
},5000);
$scope.$on('$destroy', function() {
$interval.cancel(stopChart);
});
});
/**currecy controller */
app.controller('currencyCtrl', function($scope,$rootScope, $interval){
$rootScope.BTCCoin = (Math.random()* 53000).toFixed(2); /* toFixed per scegliere quanti numeri generare dopo la virgola*/
$rootScope.ETHCoin = (Math.random()* 4500).toFixed(2);
$rootScope.CROCoin = (Math.random()* 49777).toFixed(2);
var stopCurrency = $interval(()=>{
do{
$rootScope.BTCCoin = (Math.random()* 53000).toFixed(2);
}while($rootScope.BTCCoin < 48000);
do{
$rootScope.CROCoin = (Math.random()* 49777).toFixed(2);
}while($rootScope.CROCoin < 3200);
do{
$rootScope.ETHCoin = (Math.random()* 4500).toFixed(2);
}while($rootScope.ETHCoin < 3800);
},5000);
$scope.$on('$destroy', function() {
$interval.cancel(stopCurrency);
});
})
});
uj5u.com热心网友回复:
当用户离开图表控制器页面时,表中使用的资料将被洗掉。当用户回传时,此资料会重新开始,因此回传时为空表。
为了解决这个问题,页面上的资料表应该保存在 $scope.data 的服务中。回传时,应从服务中提取资料并回传到 $scope.data。
你可以试试类似的
// Untested code
app.factory("chartService", function() {
var chartData;
function saveData(data) {
chartData = data;
}
function getData() {
return chartData;
}
return {
saveData: saveData,
getData: getData
};
});
app.controller("chartCtrl", function($rootScope, $scope, $interval, chartService) {
var data = chartService.getData();
if (data) {
// Navigating back
$scope.data = data;
} else {
// First visit of the session
$scope.data = [[],[],[]];
}
// interval code ...
$scope.$on('$destroy', function() {
chartService.saveData($scope.data);
$interval.cancel(stopChart);
});
});
0 评论