角UI路由器| $ stateParams不起作用

Question

似乎$stateParams无法正常工作。通过日期是这样的：

$state.go('state2', { someParam : 'broken magic' });

在目标状态上忽略参数

console.log('state2 params:', $stateParams); // return empty object {}

码：

    var app = angular.module('app', [
     'ui.router'
    ]);

    app.config(function($stateProvider) {
      $stateProvider
            .state('state1', {
                url: '',
                templateUrl: 'state-1.html',
                controller : function ($scope, $state, $stateParams) {
                  $scope.go = function () {
                    $state.go('state2', { someParam : 'broken magic' });
                  };

                  console.log('state1 params:', $stateParams);
                }
            })
            .state('state2', {
                url: 'state2',
                templateUrl: 'state-2.html',
                controller : function ($scope, $state, $stateParams) {
                  $scope.go = function () {
                    $state.go('state1', { someOtherParam : 'lazy lizard' });
                  };

                  console.log('state2 params:', $stateParams);
                }
            });
    });

现场示例可以在
这里
找到

谢谢。

Answer 1

您不能在状态之间传递任意参数，您需要将它们定义为定义的一部分$stateProvider。例如

$stateProvider
    .state('contacts.detail', {
        url: "/contacts/:contactId",
        templateUrl: 'contacts.detail.html',
        controller: function ($stateParams) {
            console.log($stateParams);
        }
    }) ...

上面的代码将输出定义了contactId属性的对象。如果你去/contacts/42，你$stateParams会的{contactId: 42}。

有关更多信息，请参见UI-Router URL路由的文档。