Question

我正在使用AngularJS v1.2.0-rc.2和ui-router v0.2.0。我想将引用者状态传递给另一个状态，因此我使用toParams $state.go，如下所示：

$state.go('toState', {referer: $state.current.name});

根据docs，这应该填充$stateParams控制器上的toState，但它是undefined。我错过了什么？

我创建了一个用来演示的插件：

http://plnkr.co/edit/ywEcG1

Answer 1

如果您想要传递非网址状态，则在设置url时不得使用state。我在公关上找到了the answer，并做了一些纠结，以便更好地理解。

$stateProvider.state('toState', {
  templateUrl:'wokka.html',
  controller:'stateController',
  params: {
    'referer': 'some default', 
    'param2': 'some default', 
    'etc': 'some default'
  }
});

然后您可以像这样导航到它：

$state.go('toState', { 'referer':'jimbob', 'param2':37, 'etc':'bluebell' });

或者：

var result = { referer:'jimbob', param2:37, etc:'bluebell' };
$state.go('toState', result);

然后在HTML中：

<a ui-sref="toState(thingy)" class="list-group-item" ng-repeat="thingy in thingies">{{ thingy.referer }}</a>

这个用例在文档中完全被发现，但我认为这是在不使用URL的情况下转换状态的有力手段。

Answer 2

Nathan Matthews的解决方案对我没有用，但它完全正确但是没有必要达成一个解决方法：

关键点是： $ state.go的已定义参数和toParamas的类型应该是状态转换两侧的相同数组或对象。

例如，当你在状态中定义一个params时，你的意思是params是数组，因为使用了“[]”：

$stateProvider
.state('home', {
    templateUrl: 'home',
    controller:  'homeController'
})
.state('view', {
    templateUrl: 'overview',
    params:      ['index', 'anotherKey'],
    controller:  'overviewController'
})

所以你也应该把这样的数组传递给Params：

params = { 'index': 123, 'anotherKey': 'This is a test' }
paramsArr = (val for key, val of params)
$state.go('view', paramsArr)

您可以通过$ stateParams访问它们，如下所示：

app.controller('overviewController', function($scope, $stateParams) {
    var index = $stateParams[0];
    var anotherKey = $stateParams[1];
});

更好的解决方案是在两侧使用对象而不是数组：

$stateProvider
.state('home', {
    templateUrl: 'home',
    controller:  'homeController'
})
.state('view', {
    templateUrl: 'overview',
    params:      {'index': null, 'anotherKey': null},
    controller:  'overviewController'
})

我在params定义中用[}替换了[]。为了传递给Params到$ state.go你也应该使用object而不是array：

$state.go('view', { 'index': 123, 'anotherKey': 'This is a test' })

然后你可以通过$ stateParams轻松访问它们：

app.controller('overviewController', function($scope, $stateParams) {
    var index = $stateParams.index;
    var anotherKey = $stateParams.anotherKey;
});

Answer 3

我所要做的就是在url状态定义中添加一个参数，如此

url: '/toState?referer'

卫生署！

Answer 4

不确定它是否适用于带有ui-router v0.2.0的AngularJS v1.2.0-rc.2。我已经使用ui-router v0.2.13在AngularJS v1.3.14上测试了这个解决方案。

我只是意识到没有必要像gwhn推荐的那样在URL中传递参数。

只需在状态定义中使用默认值添加参数即可。您的州仍可以拥有网址值。

$stateProvider.state('state1', {
    url : '/url',
    templateUrl : "new.html",
    controller : 'TestController',
    params: {new_param: null}
});

并将参数添加到$state.go()

$state.go('state1',{new_param: "Going places!"});

Answer 5

此页面上的这些示例都不适合我。这是我使用的，它运作良好。一些解决方案说你不能将url与$ state.go（）结合起来，但事实并非如此。尴尬的是你必须为url定义params并列出params。两者都必须存在。在Angular 1.4.8和UI Router 0.2.15上测试。

在状态中将你的参数添加到状态结尾并定义参数：

url: 'view?index&anotherKey',
params: {'index': null, 'anotherKey': null}

在控制器中，您的go语句将如下所示：

$state.go('view', { 'index': 123, 'anotherKey': 'This is a test' });

然后将params拉出并在新状态控制器中使用它们（不要忘记将$ stateParams传递给控制器函数）：

var index = $stateParams.index;
var anotherKey = $stateParams.anotherKey;
console.log(anotherKey); //it works!

Answer 6

在我的情况下，我尝试了这里给出的所有选项，但没有人正常工作（角度1.3.13，离子1.0.0，角度ui路由器0.2.13）。解决方案是：

.state('tab.friends', {
      url: '/friends/:param1/:param2',
      views: {
        'tab-friends': {
          templateUrl: 'templates/tab-friends.html',
          controller: 'FriendsCtrl'
        }
      }
    })

并且在state.go中：

$state.go('tab.friends', {param1 : val1, param2 : val2});

干杯

Answer 7

我花了很多时间与Ionic / Angular的$ state＆amp; $ stateParams;

要使用$ state.go（）和$ stateParams，您必须设置某些内容，并且其他参数不得出现。

在我的app.config（）中，我已经包含了$ stateProvider，并在其中定义了几个州：

$stateProvider
    .state('home', {
        templateUrl: 'home',
        controller:  'homeController'
    })
    .state('view', {
        templateUrl: 'overview',
        params:      ['index', 'anotherKey'],
        controller:  'overviewController'
    })

params密钥尤其重要。同样，请注意，没有url个密钥存在...利用stateParams和URL不混合。它们彼此互相排斥。

在$ state.go（）调用中，将其定义为：

$state.go('view', { 'index': 123, 'anotherKey': 'This is a test' })

index和anotherKey $ stateParams变量只有在$ stateController params定义键中首次列出时才会被填充。

在控制器中，包括$ stateParams，如图所示：

app.controller('overviewController', function($scope, $stateParams) {
    var index = $stateParams.index;
    var anotherKey = $stateParams.anotherKey;
});

传递的变量应该可用！

Answer 8

尝试使用`reload: true`？

无法弄清楚最长时间发生了什么 - 事实证明我在愚弄自己。如果您确定事情写得正确并且您将使用相同的状态，请尝试reload: true：

.state('status.item', {
    url: '/:id',
    views: {...}
}

$state.go('status.item', { id: $scope.id }, { reload: true });

希望这可以节省您的时间！

Answer 9

我遇到了类似的问题。经过大量的谷歌搜索和试验和测试，我最终得到了一个有效的解决方案。这是我的解决方案，对你有用。

我有两个控制器 - searchBoxController 和 stateResultController 以及一个名为 searchQuery 的参数，从具有搜索框的视图传递到视图显示从远程服务器获取的结果。你就是这样做的：

以下是使用$state.go()

从中调用下一个视图的控制器

.controller('searchBoxController', function ($scope, $state) {
        $scope.doSearch = function(){
            var searchInputRaw = $scope.searchQueryInput;
            $state.go('app.searchResults', { searchQuery: searchInput });
        }
    })

以下是执行$state.go()时将调用的状态：

.state('app.searchResults', 
            {
                url: '/searchResults',
                views:
                {
                    'menuContent': { templateUrl: 'templates/searchResult.html', controller: 'stateResultController' }
                },
                params: 
                {
                    'searchQuery': ''
                }
            })

最后，控制器与app.searchResults状态相关联：

.controller('stateResultController', function ($scope, $state, $stateParams, $http) {
        $scope.searchQueryInput = $stateParams.searchQuery;
    });

Answer 10

在我的父/子州的情况下。子状态中声明的所有参数必须由父状态

知道

        .state('full', {
            url: '/full',
            templateUrl: 'js/content/templates/FullReadView.html',
            params: { opmlFeed:null, source:null },
            controller: 'FullReadCtrl'
        })
        .state('full.readFeed', {
            url: '/readFeed',
            views: {
                'full': {
                    templateUrl: 'js/content/templates/ReadFeedView.html',
                    params: { opmlFeed:null, source:null },
                    controller: 'ReadFeedCtrl'
                }
            }
        })

Answer 11

我们采用具有2个参数的状态的解决方案正在发生变化：

.state('somestate', {
  url: '/somestate',
  views: {...}
}

到

.state('somestate', {
  url: '/somestate?id=:&sub=:',
  views: {...}
}

Answer 12

如果这是您想要传递的查询参数，请执行以下操作： /toState?referer=current_user

然后你需要像这样描述你的状态：

$stateProvider.state('toState', {
  url:'toState?referer',
  views:{'...'}
});

来源：https://github.com/angular-ui/ui-router/wiki/URL-Routing#query-parameters

Answer 13

您在router.js中定义以下内容

$stateProvider.state('users', {
    url: '/users',
    controller: 'UsersCtrl',
    params: {
        obj: null
    }
})

您的控制器需要添加$ stateParams。

function UserCtrl($stateParams) {
    console.log($stateParams);
}

您可以按如下所示通过参数发送对象。

$state.go('users', {obj:yourObj});

Answer 14

我试图从第1页导航到第2页，我也必须传递一些数据。

在我的 router.js 中，添加了参数 name 和 age ：

.state('page2', {
          url: '/vehicle/:source',
          params: {name: null, age: null},
.................

在第1页中，点击下一步按钮：

$state.go("page2", {name: 'Ron', age: '20'});

在 Page2 中，我可以访问这些参数：

$stateParams.name
$stateParams.age

如何使用$ state.go toParams和$ stateParams发送和检索参数？

14 个答案:

尝试使用`reload: true`？

如何使用$ state.go toParams和$ stateParams发送和检索参数？

14 个答案:

尝试使用reload: true？

尝试使用`reload: true`？