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 ...
随机推荐
- Java programming language compiler
https://docs.oracle.com/javase/7/docs/technotes/tools/windows/javac.html\ javac - Java programming l ...
- DOM操作二
1.创建节点 createElement(): 创建新的Element节点 var s = document.createElement('script'); createTextNode(): ...
- eureka-注册中心使用密码验证
spring cloud 1.1 版本之后可以使用 配置文件: bootstrap.yml server.port: 9000 spring.application.name: registry eu ...
- Java语言基础二
1.常量的概述和使用 A:什么是常量 B:Java中常量的分类 常量分类为六种:a.”字符串” b.’字符’ c.整数 d.小数 e.boolern(布尔类型) 返回值为 FALSE和TRUE ...
- LR问题汇总
关于录制打开IE问题 1.LR11用IE11录制脚本时能打开web页面,但是一直是0事件,也没有脚本代码; 解决方法: LR版本和IE版本兼容性问题,这个问题是我们安装环境时不注意,导致LR无法录制. ...
- linux初级学习笔记八:linux权限管理及权限管理命令详解!(视频序号:04_2)
本节学习的命令:chown,chgrp,chmod,openssl,umask 本节学习的技能: 文件权限详解及对其的操作 生成随机密码命令 用遮罩码对用户权限进行修改 站在用户登陆的角度来说SHEL ...
- VC++配置OpenGL开发环境
目录 第1章配置 1 第2章核心文件 6 2.1 核心文件 6 2.2 编译时使用核心文件 6 2.3 运行时使用核心文件 7 2.4 依赖关系 7 第3章 AUX ...
- BZOJ_1713_[Usaco2007 China]The Bovine Accordion and Banjo Orchestra 音乐会_斜率优化
BZOJ_1713_[Usaco2007 China]The Bovine Accordion and Banjo Orchestra 音乐会_斜率优化 Description Input 第1行输入 ...
- servlet中的servletURL,servletURI和servletPath
String servletURL=request.getservletURL(); url:站点名+当前web应用名+(目录名)+页面名 String servletURI=reques ...
- OCCI编程接口介绍
OCCI简介 Oracle® C++ Call Interface (OCCI) 是一套应用程序编程接口,它允许C++程序与一个或者多个Oracle数据库进行交互.OCCI给予你强大的数据库操作能力, ...