angularJS学习之旅(1)
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
<title></title>
</head>
<body>
<div ng-app="">
<p>姓名:<input type="text" ng-model="name"></p>
<h1>hello {{name}}</h1>
</div> </body>
</html>
AngularJS 表达式
AngularJS 表达式写在双大括号内:{{ expression }}。
AngularJS 表达式把数据绑定到 HTML,这与 ng-bind 指令有异曲同工之妙。
AngularJS 将在表达式书写的位置"输出"数据。
AngularJS 表达式 很像 JavaScript 表达式:它们可以包含文字、运算符和变量。
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
<title>AngularJS 表达式</title>
</head>
<body>
<div ng-app="">
<p>我的第一个表达式:{{5+5}}</p>
</div> </body>
</html>
AngularJs应用
AngularJS 模块(Module) 定义了 AngularJS 应用。
AngularJS 控制器(Controller) 用于控制 AngularJS 应用。
ng-app指令定义了应用, ng-controller 定义了控制器。
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
<title>AngularJS 应用</title>
</head>
<body>
<div ng-app="myApp" ng-controller="myCtrl">
名:<input type="text" ng-model="firstname"><br>
姓:<input type="text" ng-model="lastname"><br> </div>
<script>
var app=angular.module("myApp",[]);
app.controller("myCtrl",function($scope){
$scope.firstname="John";
$scope.lastname="Doe";
});
</script> </body>
</html>
angularJS学习之旅(1)的更多相关文章
- 我的AngularJS 学习之旅
我的AngularJS 学习之旅 基础篇 1.Angular的 起源 2.比较Web 页面实现的几种方式 3.一些基本术语 4.Angular与其他框架的兼容性 5.总结 6.综合实例 很早之前就 ...
- AngularJS学习之旅—AngularJS 模块(十五)
一.AngularJS 模块 模块定义了一个应用程序. 模块是应用程序中不同部分的容器. 模块是应用控制器的容器. 控制器通常属于一个模块. 1.创建模块 通过 AngularJS 的 angular ...
- AngularJS学习之旅
开篇 最近由于项目上可能需要用到AngularJS,公司将技术学习.调研的任务安排了下来,因此开始了我的AngularJS学习之路. 在这之前没写过技术博客,主要是由于太懒,另外自愧文笔不好,因此一直 ...
- 我的AngularJS 学习之旅(二)
记得某位大神说过,"时间就像海绵里的水,挤挤总是有的.".大多时候,与其说我是很忙而没时间去做自己想做的事, 倒不如说是懒得去做罢了. 废话不多说,接前一篇继续吧 3.3 指令(D ...
- AngularJS学习之旅—AngularJS 表单(十六)
一.AngularJS 表单 AngularJS 表单是输入控件的集合. HTML 控件 以下 HTML input 元素被称为 HTML 控件: input 元素 select 元素 button ...
- AngularJS学习之旅—AngularJS 事件(十四)
1.AngularJS 事件 ng-click ( 适用标签 :所有,触发事件:单击): ng-dblclick( 适用标签 :所有,触发事件:双击): ng-blur(适用标签 : a,input, ...
- AngularJS学习之旅—AngularJS HTML DOM(十三)
1.AngularJS HTML DOM AngularJS 为 HTML DOM 元素的属性提供了绑定应用数据的指令. ng-disabled 指令:ng-disabled 指令直接绑定应用程序数据 ...
- AngularJS学习之旅—AngularJS Table(十一)
1.AngularJS 表格 1. ng-repeat 指令可以完美的显示表格 AngularJS 实例 <!DOCTYPE html> <html> <head> ...
- AngularJS学习之旅—AngularJS Select(十)
1.AngularJS Select(选择框) AngularJS 可以使用数组或对象创建一个下拉列表选项. ng-option:创建一个下拉列表,列表项通过对象和数组循环输出 eg: <div ...
随机推荐
- Scalding初探之二:动手来做做小实验
输入文件 Scalding既可以处理HDFS上的数据,也可以很方便地在本地运行处理一些test case便于debug,Source有好多种 1 TextLine(filename) TextLine ...
- HDU 2717 Catch That Cow (bfs)
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=2717 Catch That Cow Time Limit: 5000/2000 MS (Java/Ot ...
- dpkg ---- apt-get ------ aptitude 三种方式的区别 及命令格式
转自:http://blog.csdn.net/xiaoyanghuaban/article/details/22946987 dpkg绕过apt包管理数据库对软件包进行操作,所以你用dpkg安装过的 ...
- spring mvc 请求转发和重定向
spring mvc controller间跳转 重定向 传参 url:http://zghbwjl.blog.163.com/blog/static/12033667220137795252845/ ...
- Windows下启动,关闭Nginx命令
启动 直接点击Nginx目录下的nginx.exe 或者 cmd运行start nginx 关闭 nginx -s stop 或者 nginx -s quit stop表示立即 ...
- 清华申请退学博士作品:完全用Linux工作
http://www.cnblogs.com/cbscan/articles/3252872.html 下文地址 http://blog.oldboyedu.com/use-linux/ 按: 尽管我 ...
- HTTP Proxy Servlet 代理服务使用
java servlet 代理服务器 1. 使用 maven 依赖 <dependency> <groupId>org.mitre.dsmiley.httpproxy< ...
- Ecs下的两台mysql做主从设置
一.主库配置master 1.用户root账户进入到mysql mysql -uroot -p 2.创建用于主从同步的账户,并赋予权限,由于这个账户只是作为同步数据用,所以分配权限不要过大,我这里只赋 ...
- Kafka/Metaq设计思想学习笔记 转
转载自: http://my.oschina.net/geecoodeer/blog/194829 本文没有特意区分它们之间的区别,仅仅是列出其中笔者认为好的设计思想,供后续设计参考. 目前笔者并没有 ...
- SwipeRefreshLayout和RecyclerView滑动冲突的解决
做了个项目,用了support包里的SwipeRefreshLayout和RecyclerView.两者一起使用有一点点小问题,有时候拉着拉着,列表还没拉玩就出来刷新的图标了,在华为荣耀上尤为明显. ...