angularjs不同页面间参数的传递
1、在路由中定义要接收的参数
.state('userDetails', {
url: '/userDetails?phone', //以?为标识接收参数
templateUrl: 'assets/views/userDetails.html',
controller:'userDetailsController' //也可以用 params:{'phone':{}}
})
2、在控制器中传递参数
.controller('pageOneCtrl', function ($scope, $state) {
$scope.toPage2 = function () {
$state.go('page2', {phone:$scope.num});
};
});
3、通过$staeParams获得参数phone
myRouterApp.controller('userDetailsController',function($scope,$stateParams){
console.log($stateParams.phone);
});
如果要传递多个参数,则用对象的形式传递
(1)在app.js中定义路由信息,并在接收的页面(即page2.html)定义接收参数。
.state('page1', {
url: '/page1',
templateUrl: 'templates/page1.html',
controller: 'pageOneCtrl'
})
.state('page2', {
url: '/page2',
templateUrl: 'templates/page2.html',
controller: 'pageTwoCtrl' ,
params:{args:{}}
})
(2)在page1中定义点击事件。
html中:
ng-click=“toPage2(name,number)”
控制器中:
.controller('pageOneCtrl', function ($scope, $state) {
$scope.toPage2 = function (name,number) {
$state.go('page2', {
args:{
NAME:name,
NUMBER:number
});
};
});
(3)在Page2中通过$staeParams获得参数ID。
.controller('pageTwoCtrl’, function ($scope, $state, $stateParams) {
var receivedName = $stateParams.args.NAME;
var receivedNumber = $stateParams.args.NUMBER;
});
angularjs不同页面间参数的传递的更多相关文章
- 使用postMesssage()实现跨域iframe页面间的信息传递----转载
由于web同源策略的限制,当页面使用跨域iframe链接时,主页面与子页面是无法交互的,这对页面间的信息传递造成了不小的麻烦,经过一系列的尝试,最后我发现有以下方法可以实现: 1. 子页面url传参 ...
- React Native移动开发实战-3-实现页面间的数据传递
React Native使用props来实现页面间数据传递和通信.在React Native中,有两种方式可以存储和传递数据:props(属性)以及state(状态),其中: props通常是在父组件 ...
- flex与后台及页面间对象的传递
1.从flex中发送请求后,利用<s:RemoteObject/>启用回调方法,类似于jQuery的post函数: <fx:Declarations> <s ...
- jsp与jsp页面间的值传递与接收
1.使用<a>标签 传递值 <a href="index.jsp?name=增加数据">增加数据</a> ///////目标页面/////值// ...
- angularjs不同页面间controller传参方式,使用service封装sessionStorage
这里分享一个我在实际项目中,使用service封装的一个依赖sessionStorage的传参服务. 这里先说下大背景,在我们的实际开发中,登陆之后一般会存在一个token,这个token将会贯穿全场 ...
- angularjs select标签中参数的传递
今天做的一个demo中需要一个下拉选择框,并根据所选择的内容向服务器发送请求. 首先百度了一下angularjs关于select的使用,一种采用ng-repeat的方式. <select ng- ...
- Flutter参数的传递和接收
上次只写了方法和参数,这次写了完整的示例,页面间参数的传递和接收的示例. 1.参数传递 用在程序上解释就是比如你进入一个商品选择列表,当你想选择一个商品的具体信息的时候,你就要传递商品编号,详细页面接 ...
- ASP.NET 页面间数据传递的方法
在做WEB开发时,很多地方会涉及到页面间的数据传递.这几天在完善教务基础系统,遇到了这个问题,上网查了一些资料,现总结如下: 说到页面间数据传递,很多人都会想到通过像Session这样的全局变量,但是 ...
- jsp页面间对象传递方法
严格的来说不能叫做JSP页面间的对象传递,实际应该是页面间对象共享的方法: 1. 通过servletcontext,也就是application对象了,但这种情况要求在同一个web应用下, ...
随机推荐
- 批量下载网站图片的Python实用小工具
定位 本文适合于熟悉Python编程且对互联网高清图片饶有兴趣的筒鞋.读完本文后,将学会如何使用Python库批量并发地抓取网页和下载图片资源.只要懂得如何安装Python库以及运行Python程序, ...
- android控件的对齐方式(转)
<?xml version="1.0" encoding="utf-8"?> <!-- android:layout_above 将该控件的底 ...
- DP专题训练之HDU 1231 最大连续子序列
Description 给定K个整数的序列{ N1, N2, ..., NK },其任意连续子序列可表示为{ Ni, Ni+1, ..., Nj },其中 1 <= i <= j < ...
- html标签快速转换思想方法
function htmlencode(s){ var div = document.createElement('div'); div.appendChild(document.createText ...
- 《编写可维护的JavaScript》——JavaScript编码规范(七)
UI层的松耦合 在web开发中,用户界面(UI)是由三个彼此隔离又相互作用的层定义的. HTML用来定义页面的数据和语义. CSS用来给页面添加样式,创建视觉特征. JavaScript用来给页面添加 ...
- SQL 对时间的处理
--获取当前日期(如:yyyy-mm-dd)Select Datename(year,GetDate())+'-'+Datename(month,GetDate())+'-'+Datename(day ...
- stm8的IIC库的使用
一.前言 stm8是一款低功耗的MCU芯片,它具备stm32库函数和资源丰富的优势.也同时具有价格便宜,低功耗的特点.在一些项目中,能起到很好的作用.下面我介绍一下stm8的IIC硬件库函数驱动代码及 ...
- java udp与tcp
一:基础 NET基本对象java.net.InetAddress类的使用 IP地址是IP使用的32位(IPv4)或者128位(IPv6)位无符号数字,它是传输层协议TCP,UDP的基础.InetAd ...
- js手风琴
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8&qu ...
- 关于Markdown
之前有接触过一点markdown,知道能生成好看的排版,只是太懒都不去看不去记那些标签 现在才发现它简单好用得有点伟大 一个在线的Markdown编辑器:https://stackedit.io/ed ...