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 ...
随机推荐
- springboot对传参的拦截统一处理
在学习某网<java秒杀系统方案优化>的课程中,学到了一种springboot对传参的拦截统一处理的方式,特记录一下. 如后台方法一般需要根据token从Session中获取User对象, ...
- 常用bluetooth协议
HFP: HFP(Hands-free Profile),让蓝牙设备可以控制电话,如接听.挂断.拒接.语音拨号等,拒接.语音拨号要视蓝牙耳机及电话是否支持. HSP: HSP 描述了 Bluetoot ...
- Couldn't connect to host, port: smtp.163.com, 25; timeout -1;
运行出现以下报错: Couldn't connect to host, port: smtp.163.com, 25; timeout -1; 也要设置端口 spring.mail.port=25
- MYSQL进阶学习笔记十一:MySQL 表的分析,检查和优化!(视频序号:进阶_28)
知识点十二:MySQL 表的分析,检查和优化(28) 表的分析,检查和优化: 定期分析表: ANALYZE [LOCAL | NO_WRITE_TO_BINLOG] TABLE tbl_name [, ...
- javaScript实现增删改查
自己写的一个html+javaScript实现增删改查小实例.下面是js代码1. [代码][JavaScript]代码 //1.创建受捐单位数组var arrOrgData = [ { & ...
- Oracle:impdb导入
最近有现场给我一份用expdp导出dmp文件,我用imp导入时,报错.因为导出dmp的数据库是11g,导入的数据库也是11g, 但客户端安装的是10g,不能用imp导入:所以只能试着用impdp导入: ...
- UVA-11078(水题)
题意: 给一个序列,找两个整数a[i],a[j]使得a[i]-a[j]最大; 思路: 从前往后扫一遍;水题; AC代码: #include <bits/stdc++.h> /* #incl ...
- 90年代经典“手游”—拼图板小游戏Opencv实现
80后可能还对儿时玩过的一种经典木质的拼图板游戏记忆犹新,一般是一种4*4或5*5规格的手持活动板,通过挪动每个小板子的位置,拼出来板子上完整的图像,那时候还没有网吧,手机也还是大哥大的天下,所以这也 ...
- SPOJ:Lexicographically Smallest(并查集&排序)
Taplu and Abhishar loved playing scrabble. One day they thought of inventing a new game using alphab ...
- python3练习题四
循环 题目: 答案: #!/usr/bin/env python3 #-*- coding:utf-8 -*- L = ['Bart', 'Lisa', 'Adam'] for i in L: pri ...