<!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. CC Arithmetic Progressions (FFT + 分块处理)

    转载请注明出处,谢谢http://blog.csdn.net/ACM_cxlove?viewmode=contents    by---cxlove 题目:给出n个数,选出三个数,按下标顺序形成等差数 ...

  2. jsp之间url传值出现中文乱码

    示例: T1.jsp http://localhost:8080/test/Test.action?site=北京 T2.jsp ..... <%@ page language="ja ...

  3. 基础知识 mfc

    句柄 资源的标示  图标句柄(HICON) 光标句柄(HCURSOR) 窗口句柄(HWND) 类似于指针 wm_keydown表示键盘上的按键按下了数值 WPARAM ||LPARAM  两个整形数据 ...

  4. box flex 弹性盒模型（转载）

    css3引入了新的盒模型——弹性盒模型,该模型决定一个盒子在其他盒子中的分布方式以及如何处理可用的空间.这与XUL(火狐使用的用户交互语言)相似,其它语言也使用相同的盒模型,如XAML .GladeX ...

  5. 转载：Java连接MySQL 数据库的正确操作流程

    转载网址:http://www.bitscn.com/pdb/mysql/201005/186551.html       以下的文章主要介绍的是Java连接MySQL 数据库(以MySQL数据库为例 ...

  6. 适用于 PHP 开发人员的 Python 基础知识

    Thomas Myer, 负责人, Triple Dog Dare Media 简介: 您是一名经验丰富的 PHP 开发人员,并且希望学习 Python 吗?本文将从 PHP 开发人员的角度来探索 P ...

  7. mysql 分区信息查看

    select partition_name part,partition_expression expr,partition_description descr,table_rows from INF ...

  8. Jasper_table_Cloud not resolve style(s)

    resolve method : delete style="".

  9. Git之detached HEAD

    今天遇到了和CSDN上博主相同的问题,就是使用git -branch -a 发现自己处于一个零时的分支上.这篇博文写的不错,转载记录一下. 转载:http://blog.csdn.net/lili62 ...

  10. 【HDOJ】1080 Human Gene Functions

    DP.wa了一下午,原来是把mmax写在外层循环了.最近事情太多了,刷题根本没状态. #include <cstdio> #include <cstring> #include ...