<!DOCTYPE html>

 <html>

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

     <title></title>

     <meta charset="utf-8" />

     <script src="../Scripts/angular.min.js"></script>

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

 </head>

 <body>

     <div ng-app="myApp">

         <div ng-controller="firstController">

             {{text}}

         </div>

         <script type="text/javascript">

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

             app.config(['$routeProvider', function ($routeProvider) {

                 $routeProvider.when("/aaa/:num", {

                     template: '<p>首页的内容</p>{{name}}', //templateUrl

                     contorller:"Aaa"

                 }).when("/bbb", {

                     template: "<p>学员的内容</p>{{name}}",

                     contorller:"Bbb"

                 }).when("/ccc", {

                     template: "test.html",

                     contorller:"Ccc"

                 }).otherwise({

                      redirectTo:"/aaa"

                 });

             }]);

         </script>

     </div>

 </body>

 </html>

AngularJs练习Demo16 ngRoute的更多相关文章

  1. AngularJS 路由：ng-route 与 ui-router

    AngularJS的ng-route模块为控制器和视图提供了[Deep-Linking]URL. 通俗来讲,ng-route模块中的$routeService监测$location.url()的变化, ...

  2. angularjs之插件ngRoute和ngAnimate

    使用ngRoute和ngAnimate配合使用,可以实现页面切换的效果. 如果有使用过swiper,就知道这个效果是怎么样的. 代码: <!DOCTYPE html> <html l ...

  3. AngularJS Best Practices: ngRoute

    app/----- components/---------- users/--------------- controllers/-------------------- users.control ...

  4. AngularJs练习Demo17 ngRoute

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  5. [AngularJS] AngularJS系列(2) 中级篇之路由

    目录 原理 angular-route ui-router 事件 深度路由 原理 ng的route本质是监听hashchange事件. 在angular-route中 $rootScope.$on(' ...

  6. angularjs 路由回退，返回到上一个路由

    在现阶段比较流行的angularjs框架中:路由是一个比较重要的应用:angularjs的单页面是其强大功能之一: 所有的页面其实就只是在一个页面就实现的:angularjs通过对路由的控制来进行页面 ...

  7. AngularJS基础总结

    w3shools    angularjs教程  wiki   <AngularJS权威教程> Introduction AngularJS is a JavaScript framewo ...

  8. ngRoute 和 ui.router 的使用方法和区别

    在单页面应用中要把各个分散的视图给组织起来是通过路由机制来实现的.本文主要对 AngularJS 原生的 ngRoute 路由模块和第三方路由模块 ui.router 的用法进行简单介绍,并做一个对比 ...

  9. AngularJs轻松入门（七）多视图切换

    在AngularJs应用中,我们可以將html碎片写在一个单独的文件中,然后在其他页面中將该段碎片加载进来.如果有多个碎片文件,我们还可以在控制器中根据用户的操作动态的加载不同的碎片,从而达到切换视图 ...

随机推荐

  1. .net概述1

    1.什么是.net 首先我先说说这个词的读音,很多外行朋友读作"点net"甚至许多圈内朋友也这样读,其实它正确读法应该是读作"dot net",音译即为&quo ...

  2. ubuntu 14.下 netbeans 自体锯齿 消除

    Ubuntu下NetBeans消除字体锯齿的方法 在netbeans.conf 文件的netbeans_default_options的最后添加 -J-Dswing.aatext=true -J-Da ...

  3. Python----Tornado安装

    Tornado安装,环境准备:          1.python安装包及安装 2.Tornado安装包 Python包安装 Linux下安装 如果使用的是 Linux系统 或 Mac OS X ,系 ...

  4. powerpoint无法输入中文怎么办|ppt文本框无法输入中文解决办法

    powerpoint文本框无法输入中文的情况不知大家是否遇到过呢?反正小编是遇到过这样的情况的,简直是急煞人也!那么powerpoint无法输入中文时应该怎么办呢?本节内容中小编就为大家带来ppt文本 ...

  5. 向PE文件中添加一个Section

    背景 之前说过直接向类HelloWorld.exe的可执行文件添加一个MessageBox弹窗, 但有时候, 需要添加的内容太多了, 因为数据与代码一起插入, 以至于可执行文件本身没有足够的空闲空间存 ...

  6. 【转】java byte转long、double、float、int、short，或者long、double、float、int、short转byte

    原文网址:http://www.xuebuyuan.com/988752.html java byte与其他数据类型的转换主要用于二进制数据的编码和解码,主要用于网络传输,读写二进制文件,java和c ...

  7. 大型分布式C++框架《四：netio之buffer管理器 下》

    每周一篇又来了.这次主要介绍netio的buffer管理器. 首先buffer管理是每一个网络层不可回避的问题.怎么高效的使用buffer是很关键的问题.这里主要介绍下我们的netio是怎么处理.说实 ...

  8. MapReduce优化一（改变切片大小和Shuffle过程Reduce占用堆大小）

    /*为防止处理超大作业时超时,将io时间设为1小时         *         <property>            <name>dfs.datanode.soc ...

  9. 二、MLlib统计指标之关联/抽样/汇总

    汇总统计[Summary statistics]: Summary statistics提供了基于列的统计信息,包括6个统计量:均值.方差.非零统计量个数.总数.最小值.最大值. import org ...

  10. Xcode开启gcc/g++

    Apple announced Xcode 4.3 for OSX Lion and 4.4 for OSX Mountain Lion last week. The major difference ...