AngularJS的简单使用
官网下载:AngularJS
路由视图需要:Angular-Route.js
基于zepto的轻量级的 JavaScript UI 库: App.js 用于开发跨平台的移动Web应用
<!DOCTYPE html>
<html ng-app='mainApp'>
<head>
<title>简单AngularJS使用</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta content="width=device-width, initial-scale=1, maximum-scale=1,minimum-scalable=1" name="viewport">
</head>
<body>
<ul>
<li><a href="#/">直接显示内容</a></li>
<li><a href="#templet">引用其他页面</a></li>
</ul>
<!-- ng-view 相当于thinkPHP里的 $this->display(); 用来实现页面渲染 -->
<div ng-view></div>
<!-- AngularJS -->
<script src="js/angular.min.js"></script>
<script src="js/angular-route.js"></script>
<script src="js/app.js"></script>
<script>
/* mainApp route */
angular.module('mainApp', ['ngRoute'])
.config(['$routeProvider', function ($routeProvider) {
$routeProvider
.when('/', {
template: '<div class="container"><p><h4>默认根目录页面</h4></p></div>'
})
.when('/templet', { //templet为模板页面调用的ID
templateUrl: "templet.htm"
})
.otherwise({
template: '<div class="container"><p><h4>默认其他页面</h4></p></div>'
});
}]);
</script>
</body>
</html>
AngularJS的简单使用的更多相关文章
- AngularJs最简单解决跨域问题案例
AngularJs最简单解决跨域问题案例 2016-05-20 09:18 82人阅读 评论(0) 收藏 举报 分类: javascript(1) 作者:白狼 出处:http://www.mank ...
- [angularjs] MVC + Web API + AngularJs 搭建简单的 CURD 框架
MVC + Web API + AngularJs 搭建简单的 CURD 框架 GitHub 地址:https://github.com/liqingwen2015/Wen.MvcSinglePage ...
- 对AngularJs的简单了解
一.简单介绍 AngularJS是为了克服HTML在构建应用上的不足而设计的.HTML是一门很好的为静态文本展示设计的声明式语言,但要构建WEB应用的话它就显得乏力了.所以我做了一些工作(你也可以觉得 ...
- 使用AngularJS实现简单:全选和取消全选功能
这里用到AngularJS四大特性之二----双向数据绑定 注意:没写一行DOM代码!这就是ng的优点,bootstrap.css为了布局,JS代码也只是简单创建ng模块和ng控制器 效果: < ...
- angularjs的简单应用(一)
AngularJS是为了克服html在构建应用上的不足而设计的.HTML是一门很好的为静态文本展示设计的声明式语言,但要构建WEB应用的话它就显得乏力了. AngularJS使用了不同的方法,它尝试去 ...
- AngularJS作出简单聊天机器人
简单聊天机器人 很初级的对话框形式.以前做对话框使用js,今天尝试使用AngularJS做出来 这里直接使用自己写的JSON数据. <!DOCTYPE html> <html lan ...
- AngularJS 实现简单购物车
使用AngularJS实现一个简单的购物车,主要感受强大的双向绑定和只关注对象不关注界面特性. 先看看界面: 点击+-操作和删除: 这些全部只需要操作数据源就行,不需要关注界面. 实现过程: 一.使用 ...
- Angularjs实现简单分页
一个后台中总需要一款分页,那我为了自己方便使用,实现如下效果 我把这个组件命名为tm.pagination,原因是因为起名真的太难起了.而且我网名也叫天名, TM就这样了吧.github地址https ...
- AngularJS实现简单的分页功能
本篇文章由:http://xinpure.com/angularjs-simple-paging-functionality/ 初学 AngularJS, 尝试着写一些小功能 代码逻辑写得略粗糙,仅仅 ...
随机推荐
- linux文件目录结构
1./ 文件系统的入口,最高一级目录 2./bin 存放基础系统所需的命令 3./boot 包含Linux内核及系统引导程序所需要的文件 4./dev 设备文件存储目录(声卡.磁盘.分区..) 5./ ...
- Autofac 依赖注入
介绍 Autofac是一款IOC框架,很轻量级性能非常高,自动注入很给力. NuGet Autofac:Autofac控制反转容器核心 Autofac.MVC5:提供IDependencyResolv ...
- 1014: [JSOI2008]火星人prefix
1014: [JSOI2008]火星人prefix Time Limit: 10 Sec Memory Limit: 162 MB Description 火星人最近研究了一种操作:求一个字串两个后缀 ...
- bzoj 4326: NOIP2015 运输计划
4326: NOIP2015 运输计划 Time Limit: 30 Sec Memory Limit: 128 MB Description 公元 2044 年,人类进入了宇宙纪元.L 国有 n 个 ...
- Python JPype 在 Win7 下安装与使用
JPype 是 Python调用 Java 代码的模块,需要Java SE Runtime Environment (JRE)的支持. 个人安装环境: Windows 7 64bit + Python ...
- PHP中explode和implode的区别
字符串的连接与分割是非常重要的两个内容,通过其可以将数组按照指定的规则转换成字符串,也可以将字符串按照指定的规则进行分割,返回一个数组.其应用范围很广,如在购物网站的购物车,在线投票系统等.这两项技术 ...
- jQuery对数组操作
//对象数组 var trackObj1={ , "direcLine":"line31" }; var currentTrack=[]; currentTra ...
- word转化jpg
用画图复制粘贴word内容,然后保存为jpg 即可~亲测可行,比截图清洗太多.
- webapi returntype
- Caf.CMS是一个免费的、 开源,功能齐全的CMS
Caf.CMS(疯狂蚂蚁CMS) 是一个免费的. 开源,功能全面的CMS(内容管理系统).定位CMS也有点狭义呢,因为Caf.CMS是基于国外SmartStore.NET 开源商城源码的基础上改造而成 ...