AngularJS学习 01进入Angular世界
Angular下载
各个版本的下载地址:https://code.angularjs.org/
打开上述URL,页面如下图:
点击需要的版本,跳出如下页面:
点击红色框内容即可下载完整的压缩包。
还可以通过通过Npm包管理工具,或者Bower获取,这里暂不涉及。
简单例子开始Angular之旅
代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="../../statics/angular/angular.min.js"></script>
</head>
<body>
<div ng-app="" ng-init="firstName='TieShen'">
<p>名字 : <input type="text" ng-model="name"></p>
<h1>Hello {{name}}</h1>
<p>姓名:<span ng-bind="firstName"></span></p>
</div>
</body>
</html>
浏览器效果:
解释:
ng-init="firstName='TieShen' 初始化了firstName变量的值
ng-model="name" 则说明了一个名字为name的变量--input框的输入值,通过{{name}} 来展示这个变量值,话说这体现了Angular的一个优势:双向数据绑定
就这么一个简单的例子,让我感受到了Angular的强大,如果用JQuery做要‘复杂’的多。希望在后续的学习中,能不断深入,毕竟2.X出来以后和1.X差别较大,表示先把1.X过一遍再去看2.X
AngularJS学习 01进入Angular世界的更多相关文章
- AngularJs学习笔记--Understanding Angular Templates
原版地址:http://docs.angularjs.org/guide/dev_guide.mvc.understanding_model angular template是一个声明规范,与mode ...
- AngularJs学习笔记--Forms
原版地址:http://code.angularjs.org/1.0.2/docs/guide/forms 控件(input.select.textarea)是用户输入数据的一种方式.Form(表单) ...
- AngularJs学习笔记--expression
原版地址:http://code.angularjs.org/1.0.2/docs/guide/expression 表达式(Expressions)是类Javascript的代码片段,通常放置在绑定 ...
- AngularJs学习笔记--directive
原版地址:http://code.angularjs.org/1.0.2/docs/guide/directive Directive是教HTML玩一些新把戏的途径.在DOM编译期间,directiv ...
- AngularJs学习笔记--Guide教程系列文章索引
在很久很久以前,一位前辈向我推荐AngularJs.但当时我没有好好学习,仅仅是讲文档浏览了一次.后来觉醒了……于是下定决心好好理解这系列的文档,并意译出来(英文水平不足……不能说是翻译,有些实在是看 ...
- AngularJs学习笔记--bootstrap
AngularJs学习笔记系列第一篇,希望我可以坚持写下去.本文内容主要来自 http://docs.angularjs.org/guide/ 文档的内容,但也加入些许自己的理解与尝试结果. 一.总括 ...
- AngularJs学习笔记--html compiler
原文再续,书接上回...依旧参考http://code.angularjs.org/1.0.2/docs/guide/compiler 一.总括 Angular的HTML compiler允许开发者自 ...
- AngularJs学习笔记--concepts(概念)
原版地址:http://code.angularjs.org/1.0.2/docs/guide/concepts 继续.. 一.总括 本文主要是angular组件(components)的概览,并说明 ...
- AngularJs学习笔记--Using $location
原版地址:http://code.angularjs.org/1.0.2/docs/guide/dev_guide.services.$location 一.What does it do? $loc ...
随机推荐
- OncrickListener的实现
在Java中实现的监控事件的方法 button.addActionListener(new ActionListener() { @Override public void actionPerform ...
- iTunes Connect 显示可供销售,但是AppStore 就是不显示新版本(异于往常版本更新)
这次版本更新,从上传到审核通过不足8小时.由于是手动发布,第二天早上上班发布了新版本.但是不同于往常,这次等了很久也不见AppStore 更新新版本.检查一下iTunes Connect ,显示可供销 ...
- 认识Android Service
一.使用Service 1.什么是Service以及Service的配置项: Service是Android组件的一种,派生自android.app.service类.它不提供交互界面,只是在后台运 ...
- GFF3格式文件
GFF3是GFF注释文件的新标准.文件中每一行为基因组的一个属性,分为9列,以TAB分开. 依次是: 1. reference sequence:参照序列 指出注释的对象.如一个染色体,克隆或片段.可 ...
- Codility NumberSolitaire Solution
1.题目: A game for one player is played on a board consisting of N consecutive squares, numbered from ...
- 12.Linux软件安装 (一步一步学习大数据系列之 Linux)
1.如何上传安装包到服务器 有三种方式: 1.1使用图形化工具,如: filezilla 如何使用FileZilla上传和下载文件 1.2使用 sftp 工具: 在 windows下使用CRT 软件 ...
- ffmpeg为视频添加时间戳 - 手动编译ffmpeg
FFMPEG给视频加时间戳水印 项目中需要给视频添加时间戳,理所当然最好用的办法是ffmpeg.在找到正确的做法前,还被网上的答案timecode给水了一下(水的不轻,在这里转了2天),大概是这样写的 ...
- Dotnet文件格式解析
0x0.序 解析过程并没有介绍对pe结构的相关解析过程,网上此类相关资料很多可自行查阅,本文只介绍了网上资料较少的从pe结构的可选头中的数据目录表中获取dotnet目录的rva和size,到完全解析d ...
- python之路十九
1.Django请求生命周期 -> URL对应关系(匹配) -> 视图函数 -> 返回用户字符串 -> URL对应关系(匹配) -> 视图函数 ...
- ElasticSearch详解与优化设计
简介 概念 安装部署 ES安装 数据索引 索引优化 内存优化 1简介 ElasticSearch(简称ES)是一个分布式.Restful的搜索及分析服务器,设计用于分布式计算:能够达到实时搜索,稳定, ...