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 选择变量开头。

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

你会这样做：

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