代码案例：
 <html>

   <head>

       <meta charset="utf-8">

     <title>AngularJS 路由实例</title>

   </head>

   <body ng-app='routingDemoApp'>

     <h2>AngularJS 路由应用</h2>

     <ul>

       <li><a href="#/">首页</a></li>

       <li><a href="#/computers">分页1</a></li>

       <li><a href="#/printers">分页2</a></li>

       <li><a href="#/blabla">其他</a></li>

     </ul>

     <div ng-view></div>

     <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>

     <script src="http://apps.bdimg.com/libs/angular-route/1.3.13/angular-route.js"></script> //注意：要引入Angular-route.js

     <script>

       angular.module('routingDemoApp',['ngRoute'])   //注意：依赖注入 ngRoute 模块

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

         $routeProvider

         .when('/',{template:'这是首页'})

         .when('/computers',{template:'这是分页1的页面'})

         .when('/printers',{template:'这是分页2页面'})

         .otherwise({redirectTo:'/'});    //找不到路径时跳转的页面

       }]);

     </script>

   </body>

 </html>

Angular.js路由 简单小案例的更多相关文章

  1. angular前端框架简单小案例

    一.angular表达式 <head> <meta charset="UTF-8"> <title>Title</title> &l ...

  2. Asp.Net Mvc+Angular.Js自测小Demo

    参考:http://www.cnblogs.com/eedc/p/6082052.html 一.引用anguler: 1.angular.js 2.angular-route.js 3.app.js ...

  3. angular中ng-bind指令小案例

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  4. JS高级---沙箱小案例

    沙箱小案例 substr截取, 从指定的字段开始截取 (function () { var str="小白喜欢小黑"; str=str.substr(2); console.log ...

  5. JS高级---闭包小案例

    闭包小案例 普通的函数 //普通的函数 function f1() { var num = 10; num++; return num; } console.log(f1()); //11 conso ...

  6. 关于Iscroll.js 的滑动和Angular.js路由冲突问题

    Iscroll主要应用于app移动端开发. 主要代码: window.onload=function(){ var myIscroll=new IScroll(".headerNav&quo ...

  7. 基于Pytorch的简单小案例

    神经网络的理论知识不是本文讨论的重点,假设读者们都是已经了解RNN的基本概念,并希望能用一些框架做一些简单的实现.这里推荐神经网络必读书目:邱锡鹏<神经网络与深度学习>.本文基于Pytor ...

  8. SpringMVC静态文件(图片)访问+js访问 简单小例子

    项目文件布局: web.xml文件: <?xml version="1.0" encoding="UTF-8"?> <web-app vers ...

  9. Vuex-全局状态管理【简单小案例】

    前言: Vuex个人见解: 1.state :所有组件共享.共用的数据.理解为不是一个全局变量,不能直接访问以及操作它.2.mutations : 如何操作 state 呢?需要有一个能操作state ...

随机推荐

  1. Node.js实战8：可用于压缩、加密的zlib。

    zlib是nodejs内置的模块,有deflate.inflate函数,使用的是gzip算法,可用于压缩和解压,也可用于数据加密.解密. 如下示例: var zlib = require(" ...

  2. STL 配接器（adapters）

    定义 配接器(adapters):将一个class的接口,转换为另一个class的接口,使得原来不能一起使用相互兼容的classes,可以一起协同工作. 配接器是一种设计模式. STL中提供的各种配接 ...

  3. org.apache.ibatis.exceptions.PersistenceException: ### Error querying database. Cause: java.lang.NumberFormatException: For input string: "W%" ### Cause: java.lang.NumberFormatException: For input s

    一个常见的myBatis xml文件中的引号错误: org.apache.ibatis.exceptions.PersistenceException: ### Error querying data ...

  4. BZOJ 1100 &&luogu 3454(计算几何+KMP）

    题面 给定一个多边形,求对称轴数量. 分析 初看这似乎是一道计算几何的题目,但是如果暴力枚举对称轴,再去判断对称轴两边的边和角是否相等,时间复杂度为\(O(n^2)\),显然会TLE 问题转换 顺时针 ...

  5. body传参？parameter传参？Request Payload？Query String Parameter?

    今天,是有委屈的一天:今天,是有小情绪的一天.所以,我们要对今天进行小结,跟它做一个了断! 今天,后端来一个接口,告诉我"要用post请求,parameter形式传参".over. ...

  6. P2731 骑马修栅栏 （欧拉路径）

    [题目描述] John是一个与其他农民一样懒的人.他讨厌骑马,因此从来不两次经过一个栅栏.你必须编一个程序,读入栅栏网络的描述,并计算出一条修栅栏的路径,使每个栅栏都恰好被经过一次.John能从任何一 ...

  7. EPROCESS ETHREAD PEB重要成员

    -----------------------------------------------------------------------win7 x86中-------------------- ...

  8. 解决本地mysql服务允许被外部主机连接

    今天在网上百度看了怎么使用外部主机连接本地MySQL服务,发现大多的说法都是不全面的,试了好久,整理下: 1.现创建了一个mysql用户,并赋予常用的操作权限 CREATE USER 'mysql'@ ...

  9. linux基础知识（三）

    添加用户 •useradd -d 家目录 -g 组名 -G 组集合(逗号间隔) -p 密码 -s 用户shell程序 用户名 •useradd -d /usr/local/nginx/ -g ngin ...

  10. poj 2689 Prime Distance(区间筛选素数)

    Prime Distance Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 9944   Accepted: 2677 De ...