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 ...
随机推荐
- java 读写JSON(一)
算是第一次正式接触Json,没有深入研究,先贴上java的代码,日后才说! package priv.chenhy.datehandle; import java.io.BufferedReader; ...
- 深入浅出数据分析 Head First Data Analysis Code 数据与代码
<深入浅出数据分析>英文名为Head First Data Analysis Code, 这本书中提供了学习使用的数据和程序,原书链接由于某些原因不 能打开,这里在提供一个下载的链接.去下 ...
- Kraken taxonomic sequence classification system
kraken:是一个将分类标签打到短DNAreads上的分类序列器.
- BNUOJ 13105 nim博弈
ncredible Chess Time Limit: 2000ms Memory Limit: 32768KB This problem will be judged on LightOJ. Ori ...
- set的应用
头文件 ;#include <set> 简单应用: begin() 返回set容器的第一个元素 end() 返回set容器的最后一个元素 clear() 删除se ...
- 2016HUAS_ACM暑假集训2K - Hero(英雄)
这也属于一个贪心题.关键是排序的依据. 这题排序的依据是敌人的伤害/血量(DPS/HP),不难证明,当这个比值相同时,不论先解决谁效果是相同的.思路大部分在注释里. 题目大意: 假设你的血量无限,但是 ...
- Visual SVN Server启动失败0x8007042a错误
今天在程序VisualSVNServer界面中启动服务时,报错如下: VisualSVNServerServer service failed to start:服务已返回特定的服务器错误 ...
- vb6 获取 http only 的 Cookie
Option Explicit ' No more data is available. ' The data area passed to a system call is too small. P ...
- Android stuido viewpagerindicator的使用
Top Level Build.gradle buildscript { repositories { maven { url "http://dl.bintray.com/populov/ ...
- 【python】类的继承和多态
比如,我们已经编写了一个名为Animal的class,有一个run()方法可以直接打印: class Animal(object): def run(self): print 'Animal is r ...