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：无法设置未定义的属性“selected”

不确定我是否正确使用手表。我甚至测试了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）函数来处理我需要的一些值的初始值，并且还可以防止由url引起的错误，如... / step / SOMERANDOMSTRING

感谢GregL的帮助！

Answer 1

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

因为当你打电话给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关键字，并且作为惯例，只有Angular核心事物应该以$或jQuery选择变量开头。

编辑：您也可以尝试使用$watch()在向导加载时收到通知，但是无法保证在加载向导后立即调用$digest()循环，因此您将依赖于$ apply /的假设向导正确添加到WizardHandler的缓存后某个时间运行$ digest循环。

你会这样做：

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