AngularJS路由使用案例:

 <!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>AngularJS路由使用案例</title>
<script type="text/javascript" src="../js/angular.min.js"></script>
<script type="text/javascript" src="../js/angular-route.min.js"></script>
</head>
<body ng-app="myapp">
<div>
<h1>在你我他学习吧,你可以学习到如下技术:</h1>
<a href="#/JAVAEE"></a>
<a href="#/AngularJS"></a>
<a href="#/EasyUI"></a>
<a href="#/MySQL"></a>
</div>
<!--路由加载后,更新变化的内容-->
<div ng-view></div>
<div>
<h1>footer</h1>
</div>
</body>
<script type="text/javascript">
//定义myapp模块
var myapp = angular.module("myapp",["ngRoute"]);
//配置模块的路由
myapp.config(["$routeProvider",function($routeProvider){
$routeProvider.when('/JAVAEE',{
templateUrl:'javaee.html'
}).when('/AngularJS',{
templateUrl:'angularjs.html'
}).when('/EasyUI',{
templateUrl:'easyui.html'
}).when('/MySQL',{
templateUrl:'mysql.html'
}).otherwise({
redirectTo:'JAVAEE'
});
}]);
</script>
</html>

javaee.html代码:

<h1>javaee</h1>

angularjs.html代码:

<h1>angular</h1>

easyui.html代码:

<h1>easyui</h1>

mysql.html代码:

<h1>mysql</h1>

AngularJS路由使用案例的更多相关文章

  1. AngularJS 路由

    AngularJS 路由允许我们通过不同的 URL 访问不同的内容. 通过 AngularJS 可以实现多视图的单页Web应用(single page web application,SPA). 通常 ...

  2. Angularjs路由需要了解的那点事

    Angularjs路由需要了解的那点事 我们知道angularjs是特别适合单页面应用,为了通过单页面完成复杂的业务功能,势必需要能够从一个视图跳转到另外一个视图,也就是需要在单个页面里边加载不同的模 ...

  3. 【转】AngularJS路由和模板

    1. AngularJS路由介绍 AngularJS路由功能是一个纯前端的解决方案,与我们熟悉的后台路由不太一样.后台路由,通过不同的URL会路由到不同的控制器上(controller),再渲染(re ...

  4. AngularJS路由和模板

    前言 如果想开发一款类似gmail的web应用,我们怎么做呢? 以jQuery的思路,做响应式的架构设计时,我们要监听所有点击事件,通过事件函数触发我们加载数据,提交,弹框,验证等的功能:以 Angu ...

  5. AngularJS路由跳转

    AngularJS是一个javascript框架,通过AngularJS这个类库可以实现目前比较流行的单页面应用,AngularJS还具有双向数据绑定的特点,更加适应页面动态内容. 所谓单页面应用就是 ...

  6. AngularJS 路由精分

    AngularJS 路由机制是由ngRoute模块提供,它允许我们将视图分解成布局和模板视图,根据url变化动态的将模板视图加载到布局中,从而实现单页面应用的页面跳转功能. AngularJS 路由允 ...

  7. AngularJS进阶(二)AngularJS路由问题解决

    AngularJS路由问题解决 遇到了一个棘手的问题:点击优惠详情时总是跳转到药店详情页面中去.再加一层地址解决了,但是后来发现问题还是来了: Could not resolve 'yhDtlMain ...

  8. angularjs路由path方式实现原理探究

    angularjs路由 https://angular.io/guide/router 通过URL解释, 来定位客户端生成的浏览器端视图. 你可绑定路由到页面的链接上, 当用户点击链接, 可以浏览到相 ...

  9. AngularJS路由系列(6)-- UI-Router的嵌套State

    本系列探寻AngularJS的路由机制,在WebStorm下开发.本篇主要涉及UI-Route的嵌套State. 假设一个主视图上有两个部分视图,部分视图1和部分视图2,主视图对应着一个state,两 ...

随机推荐

  1. JSONCkecker(C语言版本)

    /* JSON_checker.h */ typedef struct JSON_checker_struct { int valid; int state; int depth; int top; ...

  2. Mariadb Redis 的配置使用

    Mariadb Mysql 的配置使用 CentOS 7 Mariadb 的学习 在linux上安装软件的方式 yum安装 在线搜索rpm格式的软件包,进行自动的依赖关系处理,下载,安装 ​ (阿里云 ...

  3. linux学习笔记整理(八)

    第九章 文件的归档和压缩本节所讲内容:9.1 tar命令进行文件的归档和压缩9.2 zip管理压缩文件9.3 了解gzip-bzip2- xz管理压缩文件-file-sort查看文件 9.1 tar命 ...

  4. 【转】Windows中设置Fiddler抓HTTPS请求的解决办法 Unable to configure Windows to Trust the Fiddler Root certificate .

    官网设置 Click Tools > Fiddler Options > HTTPS. Click the Decrypt HTTPS Traffic box. 按照上述要求,我的设置是这 ...

  5. 吴恩达课后作业学习2-week1-1 初始化

    参考:https://blog.csdn.net/u013733326/article/details/79847918 希望大家直接到上面的网址去查看代码,下面是本人的笔记 初始化.正则化.梯度校验 ...

  6. nginx之十三:搭建 nginx 反向代理用做内网域名转发

      user www www;worker_processes 1;error_log logs/error.log;pid logs/nginx.pid;worker_rlimit_nofile 6 ...

  7. SpringBoot + Shiro + shiro.ini 的踩坑记录

    0.写在前面的话 好久没写博客了,诶,好多时候偷懒直接就抓网上的资料丢笔记里了,也就没有自己提炼,偷懒偷懒.然后最近参加了一个网络课程,要交作业的那种,为了能方便看下其他同学的作业,就写了个爬虫把作业 ...

  8. 从CompletableFuture到异步编程设计

    从CompletableFuture到异步编程设计,笔者就分为2部分来分享CompletableFuture异步编程设计,前半部分总结下CompletableFuture使用实践,后半部分分享下Com ...

  9. tomcat7 内存溢出 java.lang.OutOfMemoryError 处理方法

    找到tomcat的安装目录,在  tomcat安装目录/bin/catalina.sh最上面添加: JAVA_OPTS="-server -Xms800m -Xmx800m -XX:Perm ...

  10. Python中的鸡肋多线程

    作者:DarrenChan陈驰链接:https://www.zhihu.com/question/23474039/answer/269526476来源:知乎著作权归作者所有.商业转载请联系作者获得授 ...