In my application, I am utilizing UI-Router to ensure that the order of states is correct. To validate this, I have implemented the following code snippet:
.value('myRouteSteps', [
{ uiSref: 'myRoute.home', valid: true },
{ uiSref: 'myRoute.pageOne', valid: false },
{ uiSref: 'myRoute.pageTwo', valid: false },
])
.run([
'$rootScope',
'$state',
'myRouteSteps',
function ($rootScope, $state, myRouteSteps) {
$rootScope.$on('$stateChangeStart', function (event, toState, toParams, fromState, fromParams) {
var canGoToStep = false;
var toStateIndex = _.findIndex(myRouteSteps, function (myRouteStep) {
return myRouteStep.uiSref === toState.name;
});
console.log('toStateIndex', toStateIndex)
if (toStateIndex === 0) {
canGoToStep = true;
} else {
canGoToStep = myRouteSteps[toStateIndex - 1].valid;
}
console.log('canGoToStep', toState.name, canGoToStep);
// Prevent state change if previous state is invalid
if (!canGoToStep) {
event.preventDefault();
}
});
}
]);
During minification, there was an issue on the line
$rootScope.$on('$stateChangeStart', function (event, toState, toParams, fromState, fromParams) {To address this, I modified it to
$rootScope.$on('$stateChangeStart', ['event','toState','toParams','fromState','fromParams', function (event, toState, toParams, fromState, fromParams) {However, the error persisted despite these changes.
UPDATE:
Upon examining the minified code, I noticed the following segment:
}]).run(["$rootScope", "$state", "orderSteps", function (n, t, i) {
n.$on("$stateChangeStart", function (n, t) {
var r = !1,
u = _.findIndex(i, function (n) {
return n.uiSref === t.name
This doesn't seem right. How can I rectify this? Any suggestions?