I'm encountering an issue while attempting to transition from one state to another in my application.
In my index file, I have all of my states defined.
index.js
var MyModule = angular.module('myApp.ui.moduleTest', [
'ui.router'
])
.config(function($stateProvider, modalStateProvider){
$stateProvider
.state('myApp.dashboard.appArea.moduleTest',
modalStateProvider.create({
animation: true,
name: 'myApp.dashboard.appArea.moduleTest',
url: 'apps/moduleTest',
controllerAs: 'moduleTestCtrl',
controller: 'ModuleTestCtrl',
windowClass: 'semi-modal semi-modal--huge',
templateUrl: function() {
return 'app/ui/apps/moduleTest/widget.html';
},
resolve: {
//Some function to retrieve data
}
})
)
.state('myApp.dashboard.appArea.moduleTest.wizards',
modalStateProvider.create({
animation: true,
name: 'myApp.dashboard.appArea.moduleTest.wizards',
url: 'apps/moduleTest/runWizard',
controllerAs: 'moduleTestWizardCtrl',
controller: 'ModuleTestWizardCtrl',
templateUrl: function(){
return 'app/ui/apps/moduleTest/wizard.html';
}
// resolve: {
//
// }
})
)
})
While in the state "myApp.dashboard.appArea.moduleTest," within ModuleTestCtrl, I am trying to navigate to the state "myApp.dashboard.appArea.moduleTest.wizards." However, I am receiving the error message "could not resolve state." How can I import this configuration module into my controller to successfully navigate to that state?
/*jslint node: true */
'use strict';
var angular = require('angular');
function ModuleTestCtrl($uibModalInstance, Api, diagnosticsRaw, myService, $state) {
this.$uibModalInstance = $uibModalInstance;
this.Api = Api;
this.dataRaw = diagnosticsRaw;
this.parserData = function(indexes) {
//Some app logic irrelevant
}
myService.setPropertyToRun(this.dataRaw);
myService.setIsPropertyToRun(true);
$state.go('myApp.dashboard.appArea.moduleTest.wizards'); //THIS IS WHERE I HAVE MY PROBLEM
};
}
ModuleTestCtrl.$inject = ['$uibModalInstance', 'Api', 'diagnosticsRaw', 'myService', '$state']; module.exports = ModuleTestCtrl;