WizardHandler.wizard().goTo

Question

我使用https://github.com/mgonto/angular-wizard创建一个角向导，它的步骤可以从路由参数调用：

• /步骤/1
• /步骤/2

等。

所以我创建了一个控制器：

.controller('createOrganizer', ['$scope', 'WizardHandler' , '$routeParams',
    function($scope,WizardHandler,$routeParams)
    {
        //$scope.data = {};
        $step = $routeParams.step;
        WizardHandler.wizard().goTo($step);     
    }])

正确地在app.js和index.html上创建了正确的链接和路由。

但当我进入网址的时候，我得到了这个：

TypeError: Cannot call method 'goTo' of undefined

这是使用url参数预选角向导步骤的方式吗？

=================更新=====================

我试过这样的方法：

.controller(CreateOrganizer)，['$scope'，'WizardHandler‘，'$routeParams'，函数($scope，WizardHandler，$routeParams) { $step = $routeParams.step；

    $scope.$watch(WizardHandler.wizard(), function(step) {
            WizardHandler.wizard().goTo($step);
    });
}])

这样做的目的是观察WizardHandler.wizard()何时实例化，以便调用.goTo方法。通过这个控制器，我得到了这个错误：

TypeError:无法设置未定义的属性“选定”

不确定我是否正确地使用了手表。我甚至测试了step变量，它是可以的，显示与url相同的值。

=================解决了！=====================

    var step = parseInt($routeParams.step); // Important, as routeParams returns an String: the wizardHandler uses either an integer number or a string name of step. So I am parsing the number to prevent confusion.
    $scope.$watch(
    function() {return WizardHandler.wizard();}, 
    function (wizard) {
    if (wizard) wizard.goTo(step);
    });

我添加了一个init(step)函数，它处理我需要的一些值的初始值，并防止urls (如./step/SOMERANDOMSTRING)造成的错误

感谢GregL的帮助！

Answer 1

通过快速阅读源代码，我的第一个猜测是您使用了一个具有指定的<wizard>属性的name元素，但是您没有将相同的名称传递给WizardHandler.wizard()。在代码中，如果不为WizardHandler.wizard()指定名称参数，它将使用默认名称，即没有name属性的<wizard>使用的名称。

由于您在调用WizardHandler.wizard()时没有返回您想要的向导，所以它将解析为undefined，并且调用goTo()将失败，您得到的错误。

至少，将向导的获取和.goTo()调用分开以添加一个签入，以确保您获得了一个有效的向导：

.controller('createOrganizer', ['$scope', 'WizardHandler' , '$routeParams',
    function($scope,WizardHandler,$routeParams)
    {
        //$scope.data = {};
        $step = $routeParams.step;
        var wizard = WizardHandler.wizard();
        if (wizard)
            wizard.goTo($step);
    }]);        

在这个var赋值之前也应该有一个$step关键字，而且作为惯例，只有角度核心的东西应该以$或jQuery选择变量开始。

编辑：您也可以尝试在向导加载时使用$watch()来获得通知，但是不能保证在向导加载之后立即调用$digest()循环，因此您将依赖于这样的假设:在向导正确添加到WizardHandler的缓存后某个时候运行$apply/$摘要周期。

你会这样做的：

.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);
        });
    }]);  

Answer 2

当向导实例尚未初始化时，您可能正在尝试访问它。如果将它包装在$timeout中，它应该可以工作(与上面的$watch解决方案相比，它不那么复杂)：

$timeout(function() {
    WizardHandler.wizard().goTo($step); 
});