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 ...
随机推荐
- python 1: 解决linux系统下python中的matplotlib模块内的pyplot输出图片不能显示中文的问题
问题: 我在ubuntu14.04下用python中的matplotlib模块内的pyplot输出图片不能显示中文,怎么解决呢? 解决: 1.指定默认编码为UTF-8: 在python代码开头加入如下 ...
- 20170225-第一件事:SAP模块清单
第一件事:SAP模块清单 AM 资产会计 资产会计BC SAP Netweaver SAP NetweaverBW 业务信息仓库 业务信息仓库CA 常规跨应用程序 常规跨越应用程序CO 控制 控制 C ...
- finally{} 代码块
package Exception; /* * finally{}代码块 * * finally{]代码块是必须要被执行的,不管异常是否处理成功,该代码块里面的代码体都会被执行, */ public ...
- (linux)初学者学linux块设备驱动
面对不断升级的linux内核.GNU开发工具.linux环境下的各种图形库,很多linux应用程序开发人员和linux设备驱动开发人员即兴奋,又烦躁.兴奋的是新的软件软件.工具给我提供了更强大的功 ...
- Linux下配置rsync服务器
一.简介 rsync是一个远程数据同步工具,可以快速同步多台主机间的文件.Rsync使用所谓的“Rsync算法”来使本地和远程两个主机之间的文件达到同步,这个算法只传送两个文件的不同部分,而不是每次都 ...
- jQuery常用插件大全(9)ResponsiveSlides插件
ResponsiveSlides.js是一个展示同一容器内图片的轻量级响应式jQuery幻灯片插件(tiny responsive slideshow jQuery plugin).它支持包括IE6在 ...
- html5--6-6 CSS选择器3
html5--6-6 CSS选择器3 实例 学习要点 掌握常用的CSS选择器 了解不太常用的CSS选择器 什么是选择器 当我们定义一条样式时候,这条样式会作用于网页当中的某些元素,所谓选择器就是样式作 ...
- 并不对劲的bzoj5415:loj2718:uoj393:p4768:[NOI2018]归程
题目大意 \(n\)(\(n\leq2*10^5\))个点,\(m\)(\(m\leq4*10^5\))条边的图,每条边有海拔\(a_i(a_i\leq10^9)\).长度\(l_i(l_i\leq1 ...
- [SoapUI] Jenkins 配置不同环境(TP, LIVE)
- 廖雪峰python3练习题一
数据类型和变量 题目: 答案: print(123) print(456.789) print('\'Hello,world\'') print('\'Hello,\\\'Adam\\\'\'') p ...