1.  <!DOCTYPE html>
  2.  <html>
  3.  <head>
  4.  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  5.      <title></title>
  6.      <meta charset="utf-8" />
  7.      <script src="../Scripts/angular.min.js"></script>
  8.      <script src="../Scripts/angular-route.min.js"></script>
  9.  </head>
  10.  <body>
  11.      <div ng-app="myApp">
  12.          <div ng-controller="firstController">
  13.              {{text}}
  14.          </div>
  15.          <script type="text/javascript">
  16.              var app = angular.module("myApp", ['ngRoute']);
  17.              app.config(['$routeProvider', function ($routeProvider) {
  18.                  $routeProvider.when("/aaa/:num", {
  19.                      template: '<p>首页的内容</p>{{name}}', //templateUrl
  20.                      contorller:"Aaa"
  21.                  }).when("/bbb", {
  22.                      template: "<p>学员的内容</p>{{name}}",
  23.                      contorller:"Bbb"
  24.                  }).when("/ccc", {
  25.                      template: "test.html",
  26.                      contorller:"Ccc"
  27.                  }).otherwise({
  28.                       redirectTo:"/aaa"
  29.                  });
  30.              }]);
  31.          </script>
  32.  
  33.      </div>
  34.  </body>
  35.  </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. bayes

    from numpy import * import time starttime = time.time() def loadDataSet(): postingList = [['my', 'do ...

  2. 第几天 AC 杭电

    第几天? Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others) Total Submi ...

  3. Selenium IDE测试

    判断WEB程序是否能打开页面,并且打开了正确的页面,可以通过 assertTitle和assertLocation进行判断 并且这些操作不需要提供value. target就是期望的URL和页面标题, ...

  4. Web API的CPU占用100%

    我用Web API做了一个网站,网站很简单,请求就是几个普通的参数,提交到服务器后,在Web API里做一下参数验证,然后去访问Redis里的TIME命令,最后把TIME命令返回的结果计算出yyyy- ...

  5. c#使用UIA进行模拟点击操作

    之前,我写过一篇c#使用spy进行模拟操作的文章,有朋友在留言中提到了UIA进行操作,今天也使用UIA重新实现一次对vnc窗体的控制测试. 实现目标 在server框内填入192.168.2.200 ...

  6. sqoop组件运行出错问题解决--com.mysql.jdbc.Driver

    sqoop list-tables --connect jdbc:mysql://192.168.11.94:3306/huochetoudalian --username xxx -password ...

  7. SQLiteDatabase中的事务

    beginTransaction():开始事务endTransaction():结束事务SQLiteDatabase还提供了如下方法来判断当前上下文是否处于事物环境中.inTransaction(): ...

  8. BZOJ3301: [USACO2011 Feb] Cow Line

    3301: [USACO2011 Feb] Cow Line Time Limit: 10 Sec  Memory Limit: 128 MBSubmit: 67  Solved: 39[Submit ...

  9. 使用MapReduce查询Hbase表指定列簇的全部数据输出到HDFS（一）

    package com.bank.service; import java.io.IOException; import org.apache.hadoop.conf.Configuration;im ...

  10. Gson 基础教程 —— 自定义类型适配器(TypeAdapter)

    1,实现一个类型适配器(TypeAdapter) 自定义类型适配器需要实现两个接口: JsonSerializer<T> JsonDeserializer<T> 和两个方法: ...