<!DOCTYPE html>

<html lang="en" ng-app="myapp">

<head>

    <meta charset="UTF-8">

    <title>Document</title>

    <script src="../js/angularjs.js"></script>

    <script src="../js/angular-route.min.js"></script>

    <style type="text/css">

        body{

            font-size: 32px;

        }

        .show{

            background: #eeeeee;

            padding: 8px;

            width: 500px;

            margin:8px 0px;

        }

    </style>

</head>

<body>

<div>

    <div ng-view></div>

</div>

</body>

<script>

    var app=angular.module('myapp',['ngRoute']);

    app.controller('sub1',function($scope){

        $scope.students=students;

    });

    app.controller('sub2',function($scope,$routeParams){

        for (var i = 0;i<students.length;i++) {

            if(students[i].stuId==$routeParams.id){

                $scope.dd=students[i];

                break;

            }

        }

    });

    app.config(function($routeProvider) {

        $routeProvider

        .when('/',{

            controller:"sub1",

            templateUrl:"sub1.html"

        })

        .when('/view/:id',{

            controller:"sub2",

            templateUrl:"sub2.html",

            publicAccess:true

        })

        .otherwise({ redirectTo: '/' });

    });

    var students=[

        {stuId:1,name:"张三1",sex:"女1",score:121},

        {stuId:2,name:"张三2",sex:"女2",score:122},

        {stuId:3,name:"张三3",sex:"女3",score:123},

        {stuId:4,name:"张三4",sex:"女4",score:124}

    ]

</script>

</html>


<!--sub.html-->
<div ng-repeat="x in students" class="show">

<a href="#view/{{x.stuId}}">{{x.name}}</a>

</div>
<!--sub2.html-->
<div class="show">

    <div>学号:{{dd.stuId}}</div>

    <div>姓名:{{dd.name}}</div>

    <div>性别:{{dd.sex}}</div>

    <div>分数:{{dd.score}}</div>

</div>


 
												


											
angular多页面切换传递参数的更多相关文章
	

    
								
  1. jsp页面间传递参数 中文乱码问题(zz)
		
      jsp页面间传递参数 中文乱码问题 1.传递参数 var url = "*****Test.jsp?param1="+encodeURI(encodeURI(str));//对 ...
    
		
    2. 
						
  2. ios页面间传递参数四种方式
		
    ios页面间传递参数四种方式 1.使用SharedApplication,定义一个变量来传递. 2.使用文件,或者NSUserdefault来传递 3.通过一个单例的class来传递 4.通过Dele ...
    
		
    3. 
						
  3. Angular 全局页面切换动画 me-pageloading
		
    最近看了Codrops的一篇文章, 里面讲到了一个页面切换的效果, 详情点击此处. 看了这个效果感觉很赞, 觉得这个效果可以用在angular的页面切换中, 所以将这个效果移植到angular中, 做 ...
    
		
    4. 
						
  4. JSP页面间传递参数的5种方法
		
    JSP页面间传递参数是经常需要使用到的功能,有时还需要多个JSP页面间传递参数.下面介绍一下实现的方法. (1)直接在URL请求后添加 如:< a href="thexuan.jsp? ...
    
		
    5. 
						
  5. ionic3+angular5页面间传递参数
		
    一.从一个页面跳转到另一个页面的方法 1.引入服务 import { NavController } from 'ionic-angular'; 2.初始化 constructor(public na ...
    
		
    6. 
						
  6. jsp 页面间传递参数
		
    JSP页面间传递参数是经常需要使用到的功能,有时还需要多个JSP页面间传递参数.下面介绍一下实现的方法. (1)直接在URL请求后添加 如:< a href="thexuan.jsp? ...
    
		
    7. 
						
  7. JSP页面之间传递参数的方法有哪些？
		
    JSP页面之间传递参数的方法有哪些? 解答: 1)request 2)session 3)application 4)提交表单 5)超链接
    
		
    8. 
						
  8. 在Chrome浏览器中点击链接，打开IE浏览器，跳转到指定页面并传递参数
		
    需求: 在Chrome浏览器中点击链接,打开IE浏览器,跳转到指定页面并传递参数 过程: 一些应用软件可以通过点击URL链接启动并执行操作(例如迅雷),这是如何做到的呢? 主要是通过修改注册表,注册U ...
    
		
    9. 
						
  9. 跳转页面，传递参数——android
		
    android 跳转页面并传递对象(实体类)——项目中是集港收货类 网上资料:两种传递方法Serializable,parcelable 优劣比较:Serializable数据更持久化,网络传输或数据 ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. js表白心形特效
			
    好久没有仔细钻研技术了,闲下来借鉴一下做出一些效果 友情链接: http://tiepeng.applinzi.com/love_you/ ;;background:#ffe;font-size:12 ...
    
			
    2. 
						
  2. jQuery修炼心得-DOM节点的删除
			
    要移除页面上节点是开发者常见的操作,jQuery提供了几种不同的方法用来处理这个问题. 1.empty empty 顾名思义,清空方法,但是与删除又有点不一样,因为它只移除了 指定元素中的所有子节点. ...
    
			
    3. 
						
  3. Windows上Ruby开发环境的配置
			
    最近公司项目上有需要,需要开发一个puppet的自动化工具,这个工具需要操作存储设备上的各种资源,而鉴于puppet不是善于完成这个任务的首选语言,于是我们选择了puppet的“爹”,Ruby. 熟悉 ...
    
			
    4. 
						
  4. Linux 服务器 U盘安装（避免U盘启动）
			
    首先下载两个文件: ·         rhel-server-6.3-i386-boot.iso    启动镜像 ·         rhel-server-6.3-i386-dvd.iso     ...
    
			
    5. 
						
  5. Thinkphp与CI的区别
			
    深入学习一门新技术的最好方法就是看官方文档. ThinkPHP5.0文档: http://www.kancloud.cn/manual/thinkphp5/118003 官方的说辞是: 主要特性 :  ...
    
			
    6. 
						
  6. vue.js应用开发笔记
			
    看vue.js有几天了,之前也零零散散的瞅过,不过一直没有动手去写过demo,这几天后台事比较少,一直在讨论各种需求(其实公司对需求还是比较重视与严谨的,一个项目需求讨论就差不多一周了,这要搁之前,天 ...
    
			
    7. 
						
  7. Java7中的ForkJoin并发框架初探（上）——需求背景和设计原理
			
    原文:发表于 2013 年 8 月 26 日 由 三石 0. 处理器发展和需求背景 回想一下并发开发的初衷,其实可以说是有两点,或者说可以从两个方面看. 对于单核的处理器来说,在进行IO操作等比较费时 ...
    
			
    8. 
						
  8. 自学JS
			
    通过慕课网自学JS,敲了好多代码,好像没什么卵用,附上代码,再接再厉吧! //属性getter setter方法var man = {name : 'wsy', weibo : '@wsy', get ...
    
			
    9. 
						
  9. 也许是目前实现最好的js模拟滚动插件
			
    finger-mover 是一个集成 Fingerd(移动端以手指为单位的事件管理方案) 和 Moved(微型运动方案) 为一体的移动端动效平台,finger-mover 本身并不能为你做什么,但是附 ...
    
			
    10. 
						
  10. angular.js的表格指令
			
    html div.col-sm-12 table.table.table-bordered.table-condensed.table-hover.table-striped.dataTable.no ...
    
			
    11.