AngularJS路由使用案例
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路由使用案例的更多相关文章
- AngularJS 路由
AngularJS 路由允许我们通过不同的 URL 访问不同的内容. 通过 AngularJS 可以实现多视图的单页Web应用(single page web application,SPA). 通常 ...
- Angularjs路由需要了解的那点事
Angularjs路由需要了解的那点事 我们知道angularjs是特别适合单页面应用,为了通过单页面完成复杂的业务功能,势必需要能够从一个视图跳转到另外一个视图,也就是需要在单个页面里边加载不同的模 ...
- 【转】AngularJS路由和模板
1. AngularJS路由介绍 AngularJS路由功能是一个纯前端的解决方案,与我们熟悉的后台路由不太一样.后台路由,通过不同的URL会路由到不同的控制器上(controller),再渲染(re ...
- AngularJS路由和模板
前言 如果想开发一款类似gmail的web应用,我们怎么做呢? 以jQuery的思路,做响应式的架构设计时,我们要监听所有点击事件,通过事件函数触发我们加载数据,提交,弹框,验证等的功能:以 Angu ...
- AngularJS路由跳转
AngularJS是一个javascript框架,通过AngularJS这个类库可以实现目前比较流行的单页面应用,AngularJS还具有双向数据绑定的特点,更加适应页面动态内容. 所谓单页面应用就是 ...
- AngularJS 路由精分
AngularJS 路由机制是由ngRoute模块提供,它允许我们将视图分解成布局和模板视图,根据url变化动态的将模板视图加载到布局中,从而实现单页面应用的页面跳转功能. AngularJS 路由允 ...
- AngularJS进阶(二)AngularJS路由问题解决
AngularJS路由问题解决 遇到了一个棘手的问题:点击优惠详情时总是跳转到药店详情页面中去.再加一层地址解决了,但是后来发现问题还是来了: Could not resolve 'yhDtlMain ...
- angularjs路由path方式实现原理探究
angularjs路由 https://angular.io/guide/router 通过URL解释, 来定位客户端生成的浏览器端视图. 你可绑定路由到页面的链接上, 当用户点击链接, 可以浏览到相 ...
- AngularJS路由系列(6)-- UI-Router的嵌套State
本系列探寻AngularJS的路由机制,在WebStorm下开发.本篇主要涉及UI-Route的嵌套State. 假设一个主视图上有两个部分视图,部分视图1和部分视图2,主视图对应着一个state,两 ...
随机推荐
- node.js—Buffer类(二进制数据处理模块)
Buffer类概述 一个用于更好的操作二进制数据的类 我们在操作文件或者网络数据的时候,其实操作的就是二进制数据流 Node为我们提供了一个更加方便的去操作这种数据流的类 Buffer,他是一个全局的 ...
- ueditor百度编辑器中,多图上传后,图片顺序乱掉的处理方法
上传后,图片的顺序和预期的不一致,需要修改ueditor的源码. 一.找到editor/dialogs/attachment/attachment.js文件 1.将_this.fileList.pus ...
- I/O 机制的介绍(Linux 中直接 I/O 机制的介绍)
IO连接的建立方式 1.缓存IO.流式IO: 2.映射IO.块式IO: 3.直接IO. IO的方式: 同步.异步.定时刷新: MMAP与内核空间 mmap使用共享用户空间与内核空间实现: 直接 I/O ...
- Unicode与UTF-8关系
Unicode字符集合 Unicode 也称为 UCS(Universal Coded Character Set:国际编码字符集合) 是一个字符集合. 对世界上大部分的文字系统进行了整理,编码,使电 ...
- [matlab] 12.Optimization Tool的使用
1.quadprog 二次规划的函数 Matlab 中二次规划的数学模型可表述如下 其中 H是把目标函数二次项部分进行实对称矩阵, f是线性函数的列向量. 例求解二次规划 得到 h=[4,-4;-4, ...
- 【转】ffmpeg 常用命令
1. 视频转换 比如一个avi文件,想转为mp4,或者一个mp4想转为ts. ffmpeg -i input.avi output.mp4 ffmpeg -i input.mp4 output.ts ...
- $.each遍历实现延时
今天做项目时需要一功能,如题..... $.each(json, function(idx, obj) { setTimeout(function () {downloadFile(obj.fileK ...
- 003_webpack 配合babel 将es6转成es5
今天接触了webpack,第一次使用webpack进行转码,竟然稀里糊涂就成功了,哈哈. 下面附上流程 创建个文件夹,初始化一下,首先全局安装webpack npm install webpack - ...
- 吴恩达课后作业学习2-week1-2正则化
参考:https://blog.csdn.net/u013733326/article/details/79847918 希望大家直接到上面的网址去查看代码,下面是本人的笔记 4.正则化 1)加载数据 ...
- Luogu P4323 [JSOI2016]独特的树叶
一道比较好的树Hash的题目,提供一种不一样的Hash方法. 首先无根树的同构判断一般的做法只有树Hash,所以不会的同学可以做了Luogu P5043 [模板]树同构([BJOI2015]树的同构) ...