Ionic之页面传值
很多时候,我们都进入一个页面往往都是需要将上一级的数据转入到下一级页面中使用,在传传统的html中时经过url来传值,所以ionic也是沿用了html中的方法。
但是还是有点区别于html。我们直接在路由中设置一个名字,之后当点击到下一页的时候,将这个值传到下一页中。
路由设置:
.state('payType',{
url:'/setting/payType?settingType',
templateUrl:'views/recharge/payType.html',
controller:'payTypeController'
})
页面代码:
<ion-view view-title="充值">
<ion-content scroll="false">
<div class="item item-divider" class="fixedTips">
----------------------------请选择充值方式---------------
</div>
<div class="item item-input" ng-click="ionWchatpay()">
<ion-item class="pay-wchatpay"></ion-item>
<span style="margin-left: 20px;">
<span style="font-size: 20px;">微信支付</span><br/>
支持微信支付
</span> </div>
<div class="item item-input" ng-click="ionAlipay()">
<ion-item class="pay-alipay"></ion-item>
<span style="margin-left: 20px;">
<span style="font-size: 20px;">支付宝</span><br/>
推荐有支付宝账户的用户使用
</span>
</div>
</ion-content>
</ion-view>
js 代码:
$scope.payType = '';
$scope.ionWchatpay = function () {
$scope.payType = 'wchatpay';
console.log("传送type:"+$scope.payType);
$state.go('payType',{settingType:$scope.payType},{reload:true});
};
下一个页面引用代码:
var settingType = $stateParams.settingType;
console.log("得到的值"+settingType);
结果截图:
Ionic之页面传值的更多相关文章
- ionic 跨页面传值的几种方法
1.使用AngularJS自带的$cacheFactory服务 $cacheFactory 从字面直译即为缓存工厂,可以用它来生成缓存对象,缓存对象以key-value的方式进行数据的存储,在整个应用 ...
- ionic单页面应用中微信分享的问题总结
首先说一下 ionic 是单页面应用,也就是说整个项目就有一个index.html, 那么问题就就来了, 如果我们不同的页面要分享给大家的是不同的链接和图片,应该怎么去做呢? 这就是我们今天要总结的东 ...
- ASP.NET MVC 5 Web编程5 -- 页面传值的方式
本篇文章将讲述MVC的页面传值方式,具体包括:后端向前端传值(Controller向View传值):前端向后端传值(View向Controller传值):Action与Action之间的传值. 回顾 ...
- WebForm 页面传值
一.使用Querystring Querystring是一种非常简单的传值方式,其缺点就是会把要传送的值显示在浏览器的地址栏中,并且在此方法中不能够传递对象.如果你想传递一个安全性不是那么太重要或者是 ...
- Spring 向页面传值以及接受页面传过来的参数的方式
来源于:http://www.cnblogs.com/liuhongfeng/p/4802013.html 一.从页面接收参数 Spring MVC接收请求提交的参数值的几种方法: 使用HttpSer ...
- ASP.NET页面传值不使用QueryString
ASP.NET页面传值不使用QueryString Asp.net中的页面传值方法: 1 Url传值 特点:主要优点是实现起来非常简单,然而它的缺点是传递的值是会显示在浏览器的地址 ...
- artdialog4.1.7 中父页面给子页面传值
artdialog4.1.7中父页面给子页面传值时看了一些网友的解决方法: 在父页面声明全局变量 var returnValue=“ ”,子页面用art.dialog.opener.returnVal ...
- webform页面传值和删除修改
一.webform跨页面传值1.内置对象地址栏数据拼接 QueryString 优点:简单好用:速度快:不消耗服务器内存. 缺点:只能传字符串:保密性差(调转页面后在地址栏显示):长度有限.响应请求对 ...
- Spring-MVC接收request参数和向页面传值总结
接收请求参数值,三种方式: 1使用HttpServletRequest获取 2使用@RequestParam注解 3使用自动封装机制封装成bean对象 向页面传值 1直接使用HttpServletRe ...
随机推荐
- spring-jar包详解整理(大合集)
转:https://blog.csdn.net/weisong530624687/article/details/50888094 spring.jar 是包含有完整发布模块的单个jar 包.但是不包 ...
- React 编码
https://github.com/Minwe/style-guide/blob/master/React.js.md https://github.com/planningcenter/react ...
- SVN命令使用详解【转】
本文转载自:http://blog.sina.com.cn/s/blog_963453200101eiuq.html 1.检出svn co http://路径(目录或文件的全路径) [本地目录全路 ...
- html5--6-65 布局4-弹性布局
html5--6-65 布局4-弹性布局 实例 学习要点 掌握传统布局与CSS3新增弹性布局方式的实现和应用 弹性布局(弹性伸缩布局) 事实上它是一种新类型的盒子模型,也有书上称作弹性伸缩盒布局. 比 ...
- c#-关于自动属性的思考
参考:c#-关于自动属性的思考 我的理解:自动属性跟 公有字段 一模一样,编程习惯而已.目前是这么认为的. 自动属性:public string Name{ get; set } 公有字段:pub ...
- hdu 4302 Holedox Eating(优先队列/线段树)
题意:一只蚂蚁位与原点,在x轴正半轴上会不时地出现一些蛋糕,蚂蚁每次想吃蛋糕时选取最近的去吃,如果前后距离相同,则吃眼前的那一块(即方向为蚂蚁的正前),求最后蚂蚁行进距离. 思路:优先队列q存储蚂蚁前 ...
- I.MX6 Parallel RGB LCD Datasheet描述
/******************************************************************** * I.MX6 Parallel RGB LCD Datas ...
- BZOJ1040:骑士(基环树DP)
Z国的骑士团是一个很有势力的组织,帮会中汇聚了来自各地的精英.他们劫富济贫,惩恶扬善,受到社会各界的赞扬.最近发生了一件可怕的事情,邪恶的Y国发动了一场针对Z国的侵略战争.战火绵延五百里,在和平环境中 ...
- [Selenium] WebDriver 操作文件系统
1)屏幕截图 接口函数是 TakesScreenshot 示例: import java.io.File; import org.apache.commons.io.FileUtils; public ...
- oracle 在insert into的时候报ORA-00928: missing SELECT keyword错 [问题点数:100分,结帖人dm520]
转自:https://bbs.csdn.net/topics/310095274 INSERT INTO SA_Table(uniPositionCode,transferGroupName,appC ...