在角离子中使用状态传递参数 [英] passing parameters using state in angular ionic

问题描述

我正在使用离子技术构建应用程序.

I'm building an app using ionic.

现在，我想使用状态通过URL传递变量，但是它不起作用.最好的方法是什么?

Now I want to pass a variable trough a url using state but it does not work. What is the best way to to this?

我的方法:

$stateProvider
    .state('orders', {
        url: "/orders",
        abstract: true,
        templateUrl: "views/side-menu.html",
        cache: false,
        controller: 'OrderCtrl'
    })

    .state('orders.view-order', {
        url: "/view-order?orderid", //<---- THIS ONE
        views: {
            'menuContent': {
                templateUrl: "views/view-order.html"
            }
        },
        cache: false
    })

    .state('orders.open-orders', { 
        url: "/open-orders",
        views: {
            'menuContent': {
                templateUrl: "views/open-orders.html"
            }
        },
        cache: false
    })

我有一个基础控制器仪表板"，我想从那里使用以下命令发送订单

i have a base controller "dashboard" from where i want to send to order using

$state.go("orders.view-order", {'orderid': '232323232'});

，然后是订单控制器...(仅显示一个空对象:(

and then the order controller... (shows only a empty object :(

angular.module(appName).controller('OrderCtrl', 
 function($location, $rootScope, $scope, $ionicPopup,
   $state, $stateParams, $auth, $ionicLoading, 
   $timeout, $interval, newOrderService, jwtHelper){

    console.log($stateParams)
});

推荐答案

'OrderCtrl' 属于父级状态

.state('orders', {
    controller: 'OrderCtrl'
    ...

，而参数 orderid 是在子状态下定义的:

while the parameter orderid is defined on a child state:

.state('orders.view-order', {
        url: "/view-order?orderid", // here is param defined

这意味着，父级无法访问这些参数-因为它们是为其子级定义的

And that means, that parent cannot access these parameters - because they are defined for its child

所以，我们可以 1)将参数移到父 (我想是这样)

So, we can either 1) move parameter to parent (I would say this is the way)

有工作中的矮人

  .state('parent', {
      url: "/parent/:parentId",
      templateUrl: 'tpl.html',
      controller: 'ParentCtrl',
  })
  .state('parent.child', { 
      url: "/child/:childId",
      template: 'this is a child view',
      controller: 'ChildCtrl',
  })

或2)使用此技巧，当我们将$ stateParams放入$ rootScope并可以在任何地方观察其最新值时:

or 2) use this trick, when we place the $stateParams into $rootScope and can observe its latest value everywhere:

.run(['$rootScope', '$state', '$stateParams',
  function ($rootScope, $state, $stateParams) {
    $rootScope.$state = $state;
    $rootScope.$stateParams = $stateParams;
}])

有工作中的矮人具有这些示例状态

  .state('parent', {
      url: "/parent",
      templateUrl: 'tpl.html',
  })
  .state('parent.child', { 
      url: "/child/:childId",
      template: 'this is a child view',
      controller: 'ChildCtrl',
  })

这篇关于在角离子中使用状态传递参数的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！