ui-router嵌套状态,带参数throw extension

时间:2014-12-08 07:30:07

标签: angular-ui-router

我正在尝试使用动态选项制作一些嵌套状态。

此类状态正常:appapp.processapp.process.step2

但我的情况略有不同,因为我想在URL中传递一些数据。

这是我的州

  .state('app.process/:type', {
          url: "/process/:type",
          views: {
              'menuContent1': {
                  templateUrl: "templates/intro.html",
                  controller: 'IntroCtrl',

              }
          }
      })

      .state('step/:type/:step', {
          url: "/process/:type/:step",
          parent: 'app.process',
          views: {
              'proiew': {
                  templateUrl: "templates/processes/increase.html",

                  controller: "increaseCtrl",



              }
          }
      })

尝试运行此

 $state.go('step/:type/:step', {type:$stateParams.type, step:2});

我收到错误

Error: Could not resolve 'new/:type/:step' from state 'app.process/:type'
    at Object.transitionTo (http://localhost:8100/lib/ionic/js/ionic.bundle.js:33979:39)
    at Object.go (http://localhost:8100/lib/ionic/js/ionic.bundle.js:33862:19)
    at Scope.$scope.goNext (http://localhost:8100/js/controllers/IntroCtrl.js:11:18)
    at http://localhost:8100/lib/ionic/js/ionic.bundle.js:18471:21
    at http://localhost:8100/lib/ionic/js/ionic.bundle.js:43026:9
    at Scope.$eval (http://localhost:8100/lib/ionic/js/ionic.bundle.js:20326:28)
    at Scope.$apply (http://localhost:8100/lib/ionic/js/ionic.bundle.js:20424:23)
    at HTMLButtonElement.<anonymous> (http://localhost:8100/lib/ionic/js/ionic.bundle.js:43025:13)
    at http://localhost:8100/lib/ionic/js/ionic.bundle.js:10478:10
    at forEach (http://localhost:8100/lib/ionic/js/ionic.bundle.js:7950:18)

有什么建议吗?

1 个答案:

答案 0 :(得分:0)

有许多不同的方法可以将参数传递给某个状态,首先,您只需在点击链接时设置参数,然后从范围中获取参数。

但如果我们正在谈论更可靠和可读的内容我建议this post,特别是我喜欢使用Resolve。我在这里举一个决心的例子,但我鼓励你阅读并找出最适合你的方法:

$stateProvider
      .state("customers", {
        url : "/customers",
        templateUrl: 'customers.html',
        resolve: {

            // A string value resolves to a service
            customersResource: 'customersResource',

            // A function value resolves to the return
            // value of the function
            customers: function(customersResource){
                return customersResource.query();
            }
        },
        controller : 'customersCtrl'
      });