本文转自:http://stackoverflow.com/questions/19516771/state-go-toparams-not-passed-to-stateparams

If you want to pass non-URL state, then you must not use url when setting up your state. I found the answer on a PR and did some monkeying around to better understand.

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

Then you can navigate to it like so:

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

Or:

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

And in HTML thusly:

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

This use case is completely uncovered in the documentation, but I think it's a powerful means on transitioning state without using URLs.

The Nathan Matthews's solution did not work for me but it is totally correct but there is little point to reaching a workaround:

The key point is: Type of defined parameters and toParamas of $state.go should be same array or object on both sides of state transition.

For example when you define a params in a state as follows you means params is array because of using "[]":

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

So also you should pass toParams as array like this:

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

And you can access them via $stateParams as array like this:

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

Better solution is using object instead of array in both sides:

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

I replaced [] with {} in params definition. For passing toParams to $state.go also you should using object instead of array:

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

then you can access them via $stateParams easily:

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

[转]ionic $state.go passed $stateParams的更多相关文章

  1. --@ui-router——$state服务原版详解

    $state service in module ui.router.state Description $state service is responsible for representing ...

  2. AngularJS的增删改查、state嵌套案例,不涉及服务端

    本篇实践一个案例,大致是:左边有导航菜单,右边显示列表,并可对列表项编辑或删除,也可添加新的列表项.借此,可体会到:如何组织可扩展的AngualrJS文件结构,如何点击左侧菜单项右侧显示相应内容,an ...

  3. $stateProvider

    在你的应用中大多数状态都有与其相关联的 url,路由控制不是设计完成 state 之后的事后想法,而是开始开发时就应该考虑的问题. 这里是如何设置一个基本url. 12345 $stateProvid ...

  4. angularJs模块ui-router之路由控制

    在你的应用中大多数状态都有与其相关联的 url,路由控制不是设计完成 state 之后的事后想法,而是开始开发时就应该考虑的问题. 这里是如何设置一个基本url. $stateProvider .st ...

  5. AngularJs ui-router 路由的简单介绍

    之前有写过一篇关于Angular自带的路由:ngRoute.今天来说说Angular的第三方路由:ui-router.那么有人就会问:为什么Angular有了自带的路由,我们还需要用ui-router ...

  6. ui router 介绍

    1. 路由规则 rap框架页面路由基于ui-router实现 1.1 ui-router 一个基本的路由状态如下所示: 路由配置: $stateProvider .state('po',{ url:' ...

  7. 【原创】ui.router源码解析

    Angular系列文章之angular路由 路由(route),几乎所有的MVC(VM)框架都应该具有的特性,因为它是前端构建单页面应用(SPA)必不可少的组成部分. 那么,对于angular而言,它 ...

  8. SPA UI-router

    ------------------------------------------------------------------------------------ SPA SPA(单页面应用): ...

  9. AngularJs ui-router 路由的介绍

    AngularJs ui-router 路由介绍 野兽之前有写过一篇关于Angular自带的路由:ngRoute.今天来说说Angular的第三方路由:ui-router.那么有人就会问:为什么Ang ...

随机推荐

  1. ASP.NET AJAX Control Toolkit

    https://ajaxcontroltoolkit.codeplex.com/ 警告 7 未能找到引用的组件“Antlr3.Runtime”. 警告 6 未能找到引用的组件“HtmlAgilityP ...

  2. 创建WCF服务寄宿到IIS

    一.WCF简介: Windows Communication Foundation(WCF)是由微软开发的一系列支持数据通信的应用程序框架,可以翻译为Windows 通讯开发平台. 整合了原有的win ...

  3. MyEclipse+Mysql (二)

    上一节介绍了如何在Myeclipse中连接mysql 这一节介绍如何在java程序中访问mysql数据库中的数据b并进行简单的操作 创建一个javaProject,并输入如下java代码: packa ...

  4. Linux下建立Nexus私服

    Linux下建立Nexus私服 要安装3个东西,然后配置私服: 1.JDK 2.Maven 3.Nexus 然后配置 1.JDK的安装 下载JDK安装包,格式为RPM格式,安装即可 安装程序 #rpm ...

  5. 终端&作业控制&会话启动过程

    进程组 每个进程除了有个进程id外,还属于一个进程组.进程组是一个或者多个进程的集合.通常他们与同一个作业相关联,可以接受来自同一终端的信号.进程组id等于其进程组长id.进程组的终止与进程组长是否存 ...

  6. android: DOC命令:查看后台运行的activity:

    DOC命令:查看后台运行的activity: adb shell dumpsys activity running activity: 模拟器曾经运行过的 activity:

  7. 破解入门【OllyDebug爆破程序】

    逆向破解这块我也是个刚起步的小菜,入门都还算不上吧,看了点基础教程,先动手练习一下增加点兴趣.嘿嘿 工具: peid         //查壳工具 OllyDebug    //反汇编.动态调试工具 ...

  8. Android中ListView 控件与 Adapter 适配器如何使用?

    一个android应用的成功与否,其界面设计至关重要.为了更好的进行android ui设计,我们常常需要借助一些控件和适配器.今天小编在android培训网站上搜罗了一些有关ListView 控件与 ...

  9. 【转载】改善数据质量从数据剖析(Data Profiling)开始

    市场研究公司Forrester副总裁Erin Kinikin曾经把低劣的数据质量做了一个形象的比喻“用更好的方法访问劣质的数据,结果类似于把已经腐烂了的桃子用更快的卡车,走更好的路线运输到达市场时,桃 ...

  10. android5.x新特性之Tinting

    Android5.X对图形操作上有更多的功能.下面来看看Tinting(着色) Tinting的使用非常简单,几乎 没什么好说的,只要在xml中配置好tint和tintMode即可.直接看实际例子吧. ...