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 ...
随机推荐
- selenium 使用action进行鼠标，键盘操作
<!--test.html--> <html> <head> <title>Set Timeout</title> <script&g ...
- Python 下载 tushare 数据，然后调用 C++ DLL 计算 wMA 存入本地 csv 文件再 python 读取
CMakeLists.txt project(wMA) add_library(wMA SHARED wMA.cpp) wMA.h #pragma once #ifndef WMA_WMA_H #de ...
- ASP.NET MVC移动M站建设-使用51Degree 移动设备的识别
上一篇,介绍了移动M站的建设.说的很简单.觉得好像也没把M站给讲清楚.估计是对移动M站 认识还不够深刻吧.这里,在讲一讲51Degree 这个组件. 51degrees 号称是目前最快.最准确的设备检 ...
- inline-block元素vertical-align的问题分析
先来解释下这两个标签 inline-block: 字面意思:行内块元素,相当于强制转换,把一个标签设置为行内的块元素,既有块元素的部分特性(支持width\height\maigin-top\marg ...
- Python题目
https://github.com/taizilongxu/interview_python 1 Python的函数参数传递 strings, tuples, 和numbers是不可更改的对象,而l ...
- Android中仿IOS提示框的实现
前言 在Android开发中,我们有时需要实现类似IOS的对话框.今天我就来总结下,如何通过自定义的开发来实现类似的功能. 自定义Dialog 我们知道Android中最常用的对话框就是Dialog及 ...
- eclipse设置快速提示符
省掉废话,一个快速提示符真的能快速地提高编程效率. 下面介绍如何设置eclipse的快速提示符. 步骤如下: Windows --> preferences --> java --> ...
- HashTable初次体验
用惯了数组.ArryList,初次接触到HashTable.Dictionary这种字典储存对于我来说简直就是高大上. 1.到底什么是HashTable HashTable就是哈希表,和数组一样,是一 ...
- rcu机制
转载自:再谈Linux内核中的RCU机制-MagicBoy2010-ChinaUnix博客 http://blog.chinaunix.net/uid-23769728-id-3080134.html ...
- IIS7.0发布Web服务器0002
asp.net发布到IIS中出现错误:处理程序“PageHandlerFactory-Integrated”在其模块列表中有一个错误模块“ManagedPipelineHandler” 分类: BS学 ...