I find myself in a bit of a dilemma, as I am trying to get my application to reload when switching from one "project" to another. Despite numerous attempts and endless searching for a solution, I seem to be stuck.
My application is quite intricate, and when tested in isolation, the reload functionality works flawlessly, as expected. http://angular-ui.github.io/ui-router/site/#/api/ui.router.state.directive:ui-sref
<li ng-repeat="project in app.projects" ng-cloak>
<a ui-sref="app.channel({projectId:project.id, channelId: project.channels[0].id})" ui-sref-opts="{reload: true, notify: true}" class="active">
<span>{{ project.name }}</span>
</a>
</li>
The crucial part lies here:
ui-sref-opts="{reload: true, notify: true}
Within my routes file, there are several nested routes and views, along with a custom authenticator configuration. When I simplify the setup by removing some complexities, the reloading functions smoothly. This is why I cannot provide a code example on platforms like Codepen.
Here's where my query arises - could there be any compatibility issues between UI-Router and an authentication system, or perhaps another reason why the ui-sref-opts fails to trigger a page reload?
Apologies for the vague nature of my question, but I'm hopeful that someone might offer some guidance.
EDIT: Additional Information and Code
Let me attempt to provide you with the pertinent details.
This snippet showcases the configuration in my config.router.js file.
angular.module('app')
.run(
// Authenticator logic resides here
)
.config(
['$stateProvider', '$urlRouterProvider', 'JQ_CONFIG', '$authProvider',
function($stateProvider, $urlRouterProvider, JQ_CONFIG, $authProvider) {
// ...
.state('app.channel', {
url: '/projects/{projectId}/{channelId}',
views: {
'': {
templateUrl: 'tpl/channel/index.html'
}
},
resolve: {
deps: ['$ocLazyLoad',
function($ocLazyLoad) {
return $ocLazyLoad.load('angularFileUpload').then(
function() {
return $ocLazyLoad.load([
]);
}
);
}
]
}
})
// ...
}
]
);