Ionic 跳转页面时的参数传递 - CSDN博客
Ionic 跳转页面时的参数传递
方法1：通过factory和service和，$cacheFactory.
以service为例在整个项目中是单例的，通过修改service中的值可以在整个项目中共享数据，达到参数传递的目的。简单的说在service定义了一个‘变量’并将要传递的值复制给这个变量，再跳转到B页面，在B页面取’变量‘的值，等同于是A页面传递值给B页面。
方法2：通过地址栏参数传递
这个就我我之前熟悉的类似于get请求来传递参数。只是书写方式上略有不同
在state配置的时候定义要传递的变量（有两种方法）
注意看url，表示要传一个叫provider的参数
.state('thirtylogin', {
url: '/thirtylogin/:provider',
controller: 'ThirtyLoginController',
templateUrl: 'views/login/thirtylogin.html'
（注意看params）
.state('thirtylogin', {
url: '/thirtylogin',
params: {'provider': null},
controller: 'ThirtyLoginController',
templateUrl: 'views/login/thirtylogin.html''
在A页面的写法也有两种
$state.go('thirtylogin', {provider: 'Amazon'});
href="#/thirtylogin/Amazon" "&
在B页面接收参数，我只知道一种
var provider = $stateParams.
本文已收录于以下专栏：
相关文章推荐
1.子页面的路由配置.state('tab.articleList', {
params:{&articleType&:null},
url: '/articl...
1、使用AngularJS自带的$cacheFactory服务
$cacheFactory 从字面直译即为缓存工厂，可以用它来生成缓存对象，缓存对象以key-value的方式进行数据的存储，在整...
这是我的第一篇文章，三种跳转方法：http://blog.csdn.net/qq/article/details/
要将新页面推送到堆栈，可使用...
由于项目急且前端开发人员只会拼页面具体数据交互不会，只能我后台开发人员来写。因为是数据交互使用的是ajax方式，我首先要面临的问题是我获得的数据怎么显示在页面上，以及怎么把数据保存下来，等页面跳转时就...
在iOS中，可以使用三种不同的方式实现页面的跳转并传递参数：nib页面方式，segue方式，和代码跳转。现在先来实现使用nib设计界面并传递参数。实现如下：
（1）在项目中新建一个Cocoa Touc...
1、Servlet生命周期
a) Servlet生命周期定义为从创建到销毁的过程，遵循的过程为：
i. Servlet调用init()方法进行初始化；
ii. Servlet调用service()方法...
angularjs实现页面跳转并进行参数传递
Angular页面传参有多种办法，我在此列举4种最常见的:
1. 基于ui-router的页面跳转传参
(1) 在AngularJS的app.js中用ui...
页面跳转：
页面跳转时pagebeforechange事件会被触发两次，通过$(document).bind(&pagebeforechange&, handleChangePage);来绑定pag...
**在微信小程序里面的跳转其实和html里的超链接a差不多，我们实现跳转可以通过标签实现，也可以通过js实现，下面一一演示给大家看一下。**在展示demo前，我们需要先简单的建好项目文件夹做好准备。如...
他的最新文章
您举报文章：
举报原因：
原文地址：
原因补充：
(最多只允许输入30个字)查看: 16146|回复: 7
Ionic页面加载前 ionic页面加载完成 ionic页面销毁执行的事件
主题帖子积分
金牌会员, 积分 1489, 距离下一级还需 1511 积分
金牌会员, 积分 1489, 距离下一级还需 1511 积分
中$ionicView.beforeEnter(页面刚加载前)&&$ionicView.afterEnter&&(页面加载完成) $destroy(页面销毁) 广播事件
//ionic controller刚加载执行的广播通知方法
$scope.$on('$ionicView.beforeEnter', function() {&&
& && && && &
&&console.log('beforeEnter');
//ionic controller全部加载完成 执行的广播通知方法 （数据全部请求完成）
$scope.$on('$ionicView.afterEnter', function() {&&
& && && && && & console.log('afterEnter');&&
}, false);&&
复制代码
//ionic controller全页面销毁 执行的广播通知方法
$scope.$on('$destroy',function(){& && && && &
console.log('$destroy');& && && &&&
&&$rootScope.hideTabs = ' ';
})& &复制代码
主题帖子积分
注册会员, 积分 175, 距离下一级还需 25 积分
注册会员, 积分 175, 距离下一级还需 25 积分
感谢楼主，最近开发恰好遇到了这个问题，现已解决！
主题帖子积分
注册会员, 积分 175, 距离下一级还需 25 积分
注册会员, 积分 175, 距离下一级还需 25 积分
顺便问下楼主，如果我把数据请求写到 页面加载前请求，会不会影响体验性能和页面加载的的速度？
主题帖子积分
金牌会员, 积分 1489, 距离下一级还需 1511 积分
金牌会员, 积分 1489, 距离下一级还需 1511 积分
顺便问下楼主，如果我把数据请求写到 页面加载前请求，会不会影响体验性能和页面加载的的速度？ ...
这个应该问题不大，因为是异步请求。不会卡死的
主题帖子积分
新手上路, 积分 20, 距离下一级还需 30 积分
新手上路, 积分 20, 距离下一级还需 30 积分
本帖最后由 命无尘 于
16:24 编辑
刚好用到，楼主真乃神通广大
试了下，没有达到预期的效果，数据请求完成并没有显示在页面上。调试时，页面使用ng-repeat，在afterEnter里写获取repeat的数据所在层&div&&/div&，首次是获取不到的，所以对&div&&/div&的样式处理是显现不出来的
主题帖子积分
新手上路, 积分 12, 距离下一级还需 38 积分
新手上路, 积分 12, 距离下一级还需 38 积分
请问楼主，它如何执行销毁动作呢，类似android的finish()
主题帖子积分
金牌会员, 积分 1489, 距离下一级还需 1511 积分
金牌会员, 积分 1489, 距离下一级还需 1511 积分
请问楼主，它如何执行销毁动作呢，类似android的finish()
js对象用完以后直接&&设置为空就销毁了
主题帖子积分
注册会员, 积分 127, 距离下一级还需 73 积分
注册会员, 积分 127, 距离下一级还需 73 积分
刚好用到，楼主真乃神通广大
试了下，没有达到预期的效果，数据请求完成并没有显示在页面上。调试 ...
我也碰到同样的问题, 请问你现在解决了吗
站长推荐 /1
Ionic(ionicframework)号称未来最有潜力的一款html5移动app开发框架是Angularjs移动端解决方案，Angularjs号称下一代web应用，Ionic移动app开发教程值得拥有
Powered by1、问题描述：
　　在ionic1开发过程中，页面的跳转比较混乱，有的有动画（且方向不一致）有的没有动画，同一模块下的不同的导航标题带有动画，在用click事件在控制器里面$state.go()跳转的方式就没有动画；针对以上比较混乱的问题，书写这篇博客旨在解决问题，梳理ionic1页面跳转的问题。
2、正确页面跳转的现象：
列表页去详情页需要有动画（从右到左进入），详情页返回是由动画的（从左到右）　　
同模块之间的子级导航不能由动画，且切换流畅没有卡顿
　　ionic处理切换动画的默认形式是由的也是正确，但是前提是在同一级下的兄弟路由之间的跳转的是有动画，该动画也是可以禁掉的，基于此我们可以将整个同模块的不同页面都建立在同一级路由中，不要做深层的路由的嵌套，这样不同级的路由互相跳转就会出现问题。
同模块下的路由有不同的子导航和详情页的切换，同级的子导航链接切换禁掉默认的动画，在导航出添加nav-transition='none' 实践项目证明该属性能解决单一版本的动画问题，在不能在任何平台都起作用，如果在配上ion-direction='enter'就可以解决大部分平台的问题，
去往详情页就直接写ui-sref='xx.details'，就默认带有动画；详情页页会自动生成返回按钮，点击返回按钮就返回，且带有正确的动画效果
如果在controller里面使用$state.go()服务跳转就默认没有动画，想要带上动画就需要在后面添加&$ionicViewSwitcher.nextDirection("forward")（从右到左，$ionicViewSwitcher需要依赖注入），这种方式进入详情页没有返回按钮，需要自己手动添加返回按钮，且绑上返回事件函数;
$scope.goback = function() {
$ionicHistory.goBack();//返回上一个页面
$ionicViewSwitcher.nextDirection("back");
//动画返回上一个历史记录
ionic不同模块下的各个页面不能不能互相跳转，跳转存在问题，需要将共同的详情页放在上一级路由的同级上即不是tab里面，放在inde页面的,&ion-nav-view&&/ion-nav-view&里面直接写路由
.state('detail', {
url: '/detail',
templateUrl: 'templates/gong-detail.html',
controller: 'gongDetailsCtrl'
　　在不同模块下的子链接下都可以进入该页面，返回时没有动画且没有返回按钮，需要按照上一个部分的动态添加返回按钮，在js里返回上一个历史记录；
阅读(...) 评论()在 SegmentFault，解决技术问题
每个月，我们帮助 1000 万的开发者解决各种各样的技术问题。并助力他们在技术能力、职业生涯、影响力上获得提升。
一线的工程师、著名开源项目的作者们，都在这里：
获取验证码
已有账号？
问题对人有帮助，内容完整，我也想知道答案
问题没有实际价值，缺少关键内容，没有改进余地
信息详情页点赞，评论后，返回信息列表页，如何刷新该信息的点赞数和评论数，是需要页面刷新还是能通过angular自动更新数据？
答案对人有帮助，有参考价值
答案没帮助，是错误的答案，答非所问
在路由里面写cache false试试
答案对人有帮助，有参考价值
答案没帮助，是错误的答案，答非所问
可以通过监听列表页的$ionicView.beforeEnter事件来实现
分享到微博？
关闭理由：
删除理由：
忽略理由：
推广（招聘、广告、SEO 等）方面的内容
与已有问题重复（请编辑该提问指向已有相同问题）
答非所问，不符合答题要求
宜作评论而非答案
带有人身攻击、辱骂、仇恨等违反条款的内容
无法获得确切结果的问题
非开发直接相关的问题
非技术提问的讨论型问题
其他原因（请补充说明）
我要该，理由是：4953人阅读
AngularJS（9）
ionic（15）
ionic开发中的“返回并刷新”问题
用ionic开发时，常常会遇到”返回上一界面并且刷新”的需求,常用的解决方法有几种：
方法一：禁用缓存,全局刷新。
即在app.js中设置cache:false（用户体验最差的一种）
.state('attendance', {
url: '/main/attendance',
cache:false,
templateUrl: 'templates/attendance.html',
controller: 'AttendanceCtrl'
这样设置后，任何情况返回到这个页面都会全局刷新。体验较差，
有些不需要刷新的数据也会重新加载。如背景图等。
很多时候网速慢的话会看到重新加载后的渐变过程......
方法二： 局部刷新,进返回到某页面后，只重新加载一部分数据。
例如我返回到”主页”时，只需要重新加载那几个数字，其它的如头像等不需要重新加载。
在该页面的controller里加上
$scope.$on('$ionicView.beforeEnter', function() {
$scope.refreshLocal();
&&相关文章推荐
* 以上用户言论只代表其个人观点，不代表CSDN网站的观点或立场
访问：198047次
积分：2248
积分：2248
排名：第17837名
原创：64篇
转载：39篇
评论：21条
(1)(5)(17)(4)(7)(2)(3)(2)(3)(16)(3)(8)(11)(7)(14)
(window.slotbydup = window.slotbydup || []).push({
id: '4740887',
container: s,
size: '250,250',
display: 'inlay-fix'