代码:https://files.cnblogs.com/files/xiandedanteng/angularJSRouteSample.rar

点击‘首页’后:

点击‘电脑’后:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<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">电脑</a></li>
            <li><a href="#/printers">打印机</a></li>
            <li><a href="#/blabla">其他</a></li>
        </ul>

        <div ng-view></div>
    </body>
</html>

<script src="angular1.4.6.min.js"></script>
<script src="angular-route_1.3.13.js"></script>
<script>
    angular.module('routingDemoApp',['ngRoute'])
    .config(['$routeProvider', function($routeProvider){
        $routeProvider
        .when('/',{template:'这是首页页面'})
        .when('/computers',{template:'这是电脑页面'})
        .when('/printers',{template:'这是打印机页面'})
        .otherwise({redirectTo:'/'});
    }]);
</script>   

AngularJS中Route例子的更多相关文章

  1. angularJS中-$route路由-$http(ajax)的使用

    后台请求使用的是nodeJS驱动(后面帖代码),很简单的RESTFUL, 页面使用的是bottstarp3.0(懒人神器); 第一个例子: 在本地架设NODEJS, angular的所有请求都是请求本 ...

  2. AngularJS中的身份验证

    欢迎大家指导与讨论 : )  一.  身份验证的意义  首先呢,网络应用的身份验证的意图在于:保护网站中的重要资源.基于某些原因这些资源并不能公开,比如付费资源(交过钱的用户才能上的网络课程),或者一 ...

  3. AngularJS进阶(三十三)书海拾贝之简介AngularJS中使用factory和service的方法

    简介AngularJS中使用factory和service的方法 AngularJS支持使用服务的体系结构"关注点分离"的概念.服务是JavaScript函数,并负责只做一个特定的 ...

  4. Angularjs中的缓存以及缓存清理

    写在最前面:这篇博文是2篇文章组成,详细介绍了Angularjs中的缓存以及缓存清理,文章由上海尚学堂转载过来,欢迎大家阅读和评论.转载请注明出处,谢谢! 一个缓存就是一个组件,它可以透明地储存数据, ...

  5. AngularJS中使用Directive、Controller、Service

    AngularJS是一款非常强大的前端MVC框架.同时,它也引入了相当多的概念,这些概念我们可能不是太熟悉. (1)Directive 指令 (2)Controller 控制器 (3)Service ...

  6. AngularJS中的表单验证

    AngularJS中的表单验证 AngularJS自带了很多验证,什么必填,最大长度,最小长度...,这里记录几个有用的正则式验证 1.使用angularjs的表单验证 正则式验证 只需要配置一个正则 ...

  7. 关于angularjs中的jQuery

    关于angularjs中的jQuery 下面是一个小例子,用来说明我经常看到的一种模式.我们需要一个开关型的按钮.(注意:这个例子的代码有点装逼,并且有点冗长,只是为了用来代表更加复杂一些的例子,这些 ...

  8. 初次使用AngularJS中的ng-view,路由控制

    AngularJS中的route可以控制页面元素的改变,使多页面变成一个单页面 第一步:引入必要的js: <script src="js/lib/angular.js"> ...

  9. AngularJS中的指令全面解析(转载)

    说到AngularJS,我们首先想到的大概也就是双向数据绑定和指令系统了,这两者也是AngularJS中最为吸引人的地方.双向数据绑定呢,感觉没什么好说的,那么今天我们就来简单的讨论下AngularJ ...

随机推荐

  1. Struts2,get/set 自动获取/设置数据ActionSupport 类

    主页:http://struts.apache.org/在用户请求和模块化处理方面以及页面的展现这块,Struts2 发挥了强大的作用:相对于传统的Jsp+Servlet 模式,Struts2 更适合 ...

  2. 【Luogu】P2403所驼门王的宝藏(强连通分量)

    题目链接 想到缩点后DP这题就迷之好做 横天门就点向该行连一条边 纵门就点向该列连一条边 ziyou门直接枚举……map搞搞……话说ziyou门为啥是违规内容不让我发布? 然后缩点,DP,1A 不过写 ...

  3. GDOI2018 爆零记,Challenge Impossibility

    蒟蒻的GDOI又双叒叕考挂啦...... Day 0 && Day -1 学校月考,貌似考的还不错? 然而考完试再坐船去中山实在是慢啊......晚上10点才到酒店 wifi差评... ...

  4. [bzoj3944] sum [杜教筛模板]

    题面: 传送门 就是让你求$ \varphi\left(i\right) $以及$ \mu\left(i\right) $的前缀和 思路: 就是杜教筛的模板 我们把套路公式拿出来: $ g\left( ...

  5. POJ3207 Ikki's Story IV - Panda's Trick 【2-sat】

    题目 liympanda, one of Ikki's friend, likes playing games with Ikki. Today after minesweeping with Ikk ...

  6. .config 中特殊字符的处理

    我们知道在应用程序中嵌入连接字符串可能导致安全漏洞和维护问题.使用 Ildasm.exe(MSIL 反汇编程序) 工具可以查看编译到应用程序源代码中的未加密连接字符串.此外,如果连接字符串发生更改,则 ...

  7. ALICTF2014 EvilAPK4脱壳分析

    相关文件可以在下面链接中下载: http://pan.baidu.com/s/1sjpvFy9 1 简述 该apk使用libmobisec.so函数实现对dex的解密还原.真正的dex为assets目 ...

  8. 部署私有Docker Registry

    安装部署一个私有的Docker Registry是引入.学习和使用Docker这门技术的必经之路之一.尤其是当Docker被所在组织接受,更多人.项目和产品开始接触和使用Docker时,存储和分发自制 ...

  9. 牛客挑战赛14-F细胞

    https://www.nowcoder.com/acm/contest/81/F 循环卷积的裸题,太久没做FFT了,这么裸的循环卷积都看不出来 注意一下本文的mod 都是指表示幂的模数,而不是NTT ...

  10. 【转】重装Ubuntu时如何保留/home分区中的数据

    Windows系统可以在重装时只格式化C盘,从而保留其他分区的数据. Ubuntu系统也可以,只要在安装系统时分出一个/home分区.你可以把Ubuntu的“/”分区看为Windows的C盘,重装Ub ...