I am developing an application in Laravel + Angular using ngLaravel, which is a kind of CRUD that integrates Laravel and Angular with JWT and a template.
Although I do not have much experience in Angular, I have managed to create the modules and services that I needed for the development of the application until I have encountered the problem of maintaining the status of the filtrations and the pagination when going back either with the same browser or the same buttons of the application.
I have researched a lot about the operation of the modification of URLs to save parameters with $location.search()
.
In principle, saving the variables is not a problem for me. I have the problem when I change my view or I refresh the page with the variables in the URL (Ex: /angular-frontend/#/app/ejercicios?page=2&per_page=10
). When loading the driver, the url is empty and $location.search()
as well.
I have activated the HTML5 mode of the $locationProvider
after seeing several articles that was necessary, but still keeps emptying the parameters when reloading the page.
To show a bit of code, I save the parameters in the URL in the following way:
$scope.pageChanged = function(per_page) {
$location.search('page', $scope.pagination.current_page);
$location.search('per_page', per_page.id);
EjercicioService.pageChange($scope.pagination.current_page,per_page.id)
.then(function(data){
$scope.ejercicios = data;
$scope.pagination = $scope.ejercicios.metadata;
$scope.maxSize = 5;
});
};
They are saved correctly since the URL changes me.
The problem comes when I reload the URL and try to retrieve them, for example:
var qs = $location.search();
console.log(qs);
These are empty ... and they disappear from the URL. If that is true, that for a few milliseconds remain in the URL so I'm flying if any module is cleaning the parameters previously ...
I know that maybe I'm not giving enough information to see the problem, but I would appreciate it if someone can give me some clue as to where the shots might go or if something similar has happened to you.
EDIT 1: Attached the configuration of the Route Provider:
.state('app.ejercicios',{
url: "/ejercicios",
templateUrl: "app/modules/ejercicio/views/ejercicios.html",
ncyBreadcrumb: {
label: 'Ejercicios',
parent:'app'
},
data: {
permits: { // this permissions not define in back-end model
withAny: ['view_ejercicios','delete_ejericicios']
}
},
reloadOnSearch: false,
controller:'EjercicioListCtrl',
location: false,
resolve: {
trans:['RequireTranslations',
function (RequireTranslations) {
RequireTranslations('modules/ejercicio');
}],
dep: ['trans','$ocLazyLoad',
function(trans, $ocLazyLoad ){
return $ocLazyLoad.load([
'sweet-alert2', 'ui-bs-paging', 'EjercicioServiceModule',
'FiltroServiceModule', 'CategoriaFiltroServiceModule',
'ui-select-filter', 'select2'
]).then(
function(){
return $ocLazyLoad.load([
'app/modules/ejercicio/controllers/EjercicioListCtrl.js'
]);
}
);
}]
}
})
Thanks in advance.