Angular ui-router:在状态之间传递参数 [英] Angular ui-router : Passing params between states

查看:134
本文介绍了Angular ui-router:在状态之间传递参数的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在尝试在ui路由器中将消息从state1传递到state2.

I'm trying to pass a message from state1 to state2 in ui-router.

在这里查找了有关该主题的大多数问题,但不幸的是无法理解.

looked up most of the question on here about this topic but unfortunately can't make sense of it.

这是我的主要代码和$ stateProvider:

This is my main code and $stateProvider :

myApp.config(function($stateProvider, $urlRouterProvider) {
  //
  // For any unmatched url, redirect to /state1
  $urlRouterProvider.otherwise("/state1");
  //
  // Now set up the states
  $stateProvider
    .state('state1', {
      url: "/state1",
      templateUrl: "state1.html"
    })
        .state('state2', {
      url: "/state2",
      templateUrl: "state2.html"
    })

});

这里是我为测试这一点而创建的Plunker.

Here is a Plunker of what i created to test this out.

我应该怎么做才能使其正常工作?谢谢

What should i do to make it work? Thanks

推荐答案

类似的东西

myApp.config(function($stateProvider, $urlRouterProvider) {
  //
  // For any unmatched url, redirect to /state1
  $urlRouterProvider.otherwise("/state1");
  //
  // Now set up the states
  $stateProvider
    .state('state1', {
      url: "/state1",
      templateUrl: "state1.html"
    })
        .state('state2', {
      url: "/state2/:id",
      templateUrl: "state2.html"
    })

});

 myApp.config(function($stateProvider, $urlRouterProvider) {
      //
      // For any unmatched url, redirect to /state1
      $urlRouterProvider.otherwise("/state1");
      //
      // Now set up the states
      $stateProvider
        .state('state1', {
          url: "/state1",
          templateUrl: "state1.html"
        })
            .state('state2', {
          url: "/state2",
          templateUrl: "state2.html",
          params: {id: ""}
        })

    });

然后是ui-serf

then the ui-serf

<a ui-sref="state2({id:'value'})">Send param and go to page 2</a>

名称(id)必须相等

这篇关于Angular ui-router:在状态之间传递参数的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆