Contrôler le rafraichissement d'une page
Bonjour a tous,
Apres plus d'une semaine de recherche je viens vers vous concernant un probleme lie a l'utilisation de $rootscope broadcast/on, $interval, et de ng-repeat.
je m'excuse d'avance si le probleme est traite dans un autre topic, j'ai pourtant passe bcp de temps a chercher.
Mes problemes sont les suivants :
1. avoir deux $interval independant sur la meme page : j'ai la sensation que ce n'est pas possible.
2. controler le refresh de la page :
mon objectif : si mon objet workflowmetadatalist est different du precedent, j'actualise ma zone html. sinon je n'actualise pas la zone.
en plus du code que j'ai partage ci-dessous cohabite un autre couple factory/controller/html de structure similairdont le temps de refresh est de 2000 ms.
mon probleme : mon $rootscope.on('APPCatalog') est bien execute quand le je souhaite.
dans le html, la zone englobee par les ng-repeat est reconstruite toute les 2000ms. --> ma zone est donc polluée par l'autre evenement.
Question global: comment puis-je empecher la zone html d'etre rafraichie tout en gardant les valeurs precedente ?
Merci Grandement !
Gab
html - zone englobee dans par le ng-controller:
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36
| <div class="ibox float-e-margins" ng-controller="APPCatalogController">
<div class="ibox-heading">
<h1>{{view[0].catalog.title}}</h1>
</div>
<div class="ibox-content col-sm-12">
<div class="input-group m-b col-sm-6">
<span class="input-group-addon"><i class="fa fa-search"></i></span>
<input type="text" placeholder="Search" class="form-control" ng-model="query">
</div>
<div class="ibox-content" slim-scroll box-height="600px">
<div class="col-sm-12" style="margin-left: -20px; " ng-repeat="workflows in workflowsMetadataList | filter:query | groupBy: 'project_name'| toArray:true | orderBy:'$key'">
<h3>{{workflows.$key}}</h3>
<div class="col-sm-3" ng-repeat="w in workflows" ng-click="showSubmitWorkflowModal(w)">
<div class="panel panel-default">
<div class="panel-body">
<img ng-src="{{appFindImageUrl(w)}}"
alt="{{w.name}}"
/>
<div>
<span>{{w.name}}</span>
</div>
</div>
<div class="panel-footer">
<div>
{{ w.name }}
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div> |
Js - Factory APPCatalog
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67
| appCtrl.factory('APPCatalog', function ($http, $rootScope, SpringDataRestAdapter, $interval) {
var APPCatalogRefreshTime = 10000;
var workflowsMetadataList = [];
var nbworkflows = 0;
var appCatalog = JSON.parse(localStorage['appCatalogUrl']);
function getAPPCatalog() {
var scopeResponse;
console.log("APPCatalog.APPCatalog http.get url : " + appCatalog);
var httpPromise = $http.get(appCatalog)
.success(function (response) {
console.log("APPCAtalog.getAPPCAtalog http.get success " );
})
.error(function (response) {
console.error("APPCatalog http.get error", status, response);
});
SpringDataRestAdapter.process(httpPromise).then(function (processedResponse) {
// if workflowsMetadataList is not equivalent to its previous value OR if workflowsMetadataList is empty (useful for the first load)
if (angular.equals(workflowsMetadataList, processedResponse._embeddedItems) == false || workflowsMetadataList == [] ) {
workflowsMetadataList = processedResponse._embeddedItems;
nbworkflows = processedResponse.page.totalElements;
$rootScope.$broadcast('event:APPCatalog');
}
});
$rootScope.$on('event:StopRefreshing', function () {workflowsMetadataList = []});
}
function refreshAPPCatalog() {
getAPPCatalog();
// Interval initialization
var intervalPromise = $rootScope.$interval(getAPPCatalog, APPCatalogRefreshTime);
console.debug("broadcasting refreshAPPCatalog");
// Interval stopping condition
$rootScope.$on('event:StopRefreshing', function () {
if (angular.isDefined(intervalPromise)) {
$interval.cancel(intervalPromise);
intervalPromise = undefined;
}
});
}
return {
getworkflowsMetadataList: function () {
return workflowsMetadataList;
},
getnbworkflows: function () {
return nbworkflows;
},
refreshAPPCatalog: function () {
return refreshAPPCatalog();
}
};
}); |
js - appcatalogController
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36
| appCtrl.controller('APPCatalogController', function ($scope, $rootScope, $uibModal, $http, $filter, APPCatalog, PCANodeSourcesService, loadingConfigData) {
$scope.workflowsMetadataList = [];
$scope.view = [];
var schedulerRestUrl = JSON.parse(localStorage['schedulerRestUrl']);
var appCatalogUrl = JSON.parse(localStorage['appCatalogUrl']);
// get catalog name
loadingConfigData.success(function(response){
$scope.view = response.view; // used in html as following : view[0].catalog.title
});
// get list
$rootScope.$on('event:APPCatalog', function () {
$scope.workflowsMetadataList = APPCatalog.getworkflowsMetadataList();
console.debug("event APPCatalog fired in APP Catalog Controller");
});
$scope.appFindImageUrl = function (selectedWorkflow) {
console.debug("function findImageUrl is called ");
if($filter('getByKey')('pca.action.icon', selectedWorkflow.generic_information) == ""){
return "/studio/images/about_115.png";
}
else{
if ($filter('getByKey')('pca.action.icon', selectedWorkflow.generic_information) == undefined){
}
return $filter('getByKey')('pca.action.icon', selectedWorkflow.generic_information);}
};
} |