WizardHandler.wizard().goTo
From reading through the source code quickly, my first guess would be that you have used a <wizard>
element with a name
property specified, but you have not passed that same name to WizardHandler.wizard()
. In the code, if you don't specify a name argument to WizardHandler.wizard()
, it will use the default name, which is the name used by a <wizard>
with no name
attribute.
Since you are not getting back the wizard you are intending when you call WizardHandler.wizard()
, it resolves to undefined
and calling goTo()
will fail with the error you got.
At the very least, separate the getting of the wizard and the .goTo()
call to add a check in to make sure you got a valid wizard:
.controller('createOrganizer', ['$scope', 'WizardHandler' , '$routeParams',
function($scope,WizardHandler,$routeParams)
{
//$scope.data = {};
$step = $routeParams.step;
var wizard = WizardHandler.wizard();
if (wizard)
wizard.goTo($step);
}]);
There should probably be a var
keyword before that $step
assignment, too, and as a convention, only Angular core things should start with a $
, or jQuery selection variables.
EDIT: You could also try using a $watch()
to get notified when the wizard is loaded, however there is no guarantee that the $digest()
cycle will be called immediately after the wizard is loaded, so you would be relying on the assumption that the $apply/$digest cycle is run sometime after the wizard is correctly added to the WizardHandler
's cache.
You would do this like so:
.controller('createOrganizer', ['$scope', 'WizardHandler' , '$routeParams',
function($scope,WizardHandler,$routeParams)
{
//$scope.data = {};
$step = $routeParams.step;
$scope.$watch(function() {
return WizardHandler.wizard();
}, function (wizard) {
if (wizard)
wizard.goTo($step);
});
}]);