简介

AngularJS 是一个 JavaScript 框架。它可通过 <script> 标签添加到 HTML 页面。

AngularJS 通过 指令 扩展了 HTML,且通过 表达式 绑定数据到 HTML。

AngularJS 是一个 JavaScript 框架。它是一个以 JavaScript 编写的库。

AngularJS 是以一个 JavaScript 文件形式发布的,可通过 script 标签添加到网页中:

<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>

AngularJS 通过 ng-directives 扩展了 HTML。AngularJS 指令是以 ng 作为前缀的 HTML 属性

ng-app 指令定义一个 AngularJS 应用程序。

ng-model 指令 把元素值(比如输入域的值)绑定到应用程序。

ng-bind 或{{}}指令 把应用程序数据绑定到 HTML 视图。

实例:

<!DOCTYPE html>
<html>
<body>
<div ng-app="">
<p>在输入框中尝试输入:</p>
<p>姓名:<input type="text" ng-model="name"></p>
<p ng-bind="name"></p>
</div>
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
</body>
</html>

当网页加载完毕,AngularJS 自动开启。

ng-app 指令告诉 AngularJS,<div> 元素是 AngularJS 应用程序 的"所有者"。

ng-model 指令把输入域的值绑定到应用程序变量 name

ng-bind 指令把应用程序变量 name 绑定到某个段落的 innerHTML。

AngularJS 表达式

AngularJS 表达式写在双大括号内:{{ expression }}

AngularJS 表达式把数据绑定到 HTML,这与 ng-bind 指令有异曲同工之妙。

AngularJS 将在表达式书写的位置"输出"数据。

AngularJS 表达式 很像 JavaScript 表达式:它们可以包含文字、运算符和变量。实例 {{ 5 + 5 }} 或 {{ firstName + " " + lastName }}

AngularJS 对象就像 JavaScript 对象:person={firstName:'John',lastName:'Doe'}

AngularJS 数组就像 JavaScript 数组:points=[1,15,19,2,40]

angular开发工具介绍

代码编辑工具:Sublime(轻量级)、webstorm

断点调试工具:chrome插件batarang

版本管理工具:git

开发和调试工具:Nodejs,,npm包管理器【npm install xxx】以下都可以通过npm安装

代码合并和混淆工具:grunt

依赖管理工具:bower

轻量级server:http-server    模拟后台,在目录下模拟一些文件数据

js单元测试runner:karma+jasmine

Karma:跑测试用例的runner;jasmine:用例编写测试用例

Angularjs专用的单元测试工具:Protrator

【angularJS】简介的更多相关文章

  1. Angularjs简介

    很久没有系统学习一个新技术了,angularjs将会比较系统的讲解这个技术的语法.应用.次类型的博客将会持续更新,博主也是一个初学者,如果有问题欢迎留言讨论. angularjs简介. angular ...

  2. AngularJS学习之旅—AngularJS 简介(一)

    一.AngularJS 简介 1.AngularJS 是一个 JavaScript 框架. AngularJS 是一个 JavaScript 框架.它是一个以 JavaScript 编写的库.Angu ...

  3. 【03】AngularJS 简介

    AngularJS 简介 AngularJS 是一个 JavaScript 框架.它可通过 <script> 标签添加到 HTML 页面. AngularJS 通过 指令 扩展了 HTML ...

  4. AngularJS简介与四大特征

    1.1 AngularJS简介 AngularJS  诞生于2009年,由Misko Hevery 等人创建,后为Google所收购.是一款优秀的前端JS框架,已经被用于Google的多款产品当中.A ...

  5. Angular企业级开发(1)-AngularJS简介

    AngularJS介绍 AngularJS是一个功能完善的JavaScript前端框架,同时是基于MVC(Model-View-Controller理念的框架,使用它能够高效的开发桌面web app和 ...

  6. 01、AngularJs简介

    AngularJs致力于减轻程序员在开发Ajax应用过程的痛苦.做前端的童鞋都知道,当在开发Ajax应用时,我们在与后台交互的同时,还在不断的手动操作Dom,诸如自己组装后台数据,渲染Html标签生成 ...

  7. AngularJS 简介

    AngularJS 是一个 JavaScript 框架. 它可通过 <script> 标签添加到 HTML 页面. <script src="http://apps.bdi ...

  8. AngularJS 简介、指令、表达式

    AngularJS 是一个 JavaScript 框架.它可通过 <script> 标签添加到 HTML 页面. AngularJS 通过指令扩展了 HTML,且通过表达式绑定数据到 HT ...

  9. AngularJS开发指南1:AngularJS简介

    什么是 AngularJS? AngularJS 是一个为动态WEB应用设计的结构框架.它能让你使用HTML作为模板语言,通过扩展HTML的语法,让你能更清楚.简洁地构建你的应用组件.它的创新点在于, ...

  10. 跨平台移动APP开发进阶(四)AngularJS简介

    AngularJS 是一个为动态WEB应用设计的结构框架.它能让你使用HTML作为模板语言,通过扩展HTML的语法,让你能更清楚.简洁地构建你的应用组件. 它的创新点在于,利用 数据绑定 和 依赖注入 ...

随机推荐

  1. 由angular命令行工具(angular-cli)生成的目录和文件

    e2e目录:是端到端的测试目录,包含基本的测试桩.是用来做自动测试的. src:应用源代码目录.我们写的所有代码都应该在这里面. app:包括应用的组件和模块.我们自己写的绝大部分代码都是写在这个目录 ...

  2. spring mvc: json练习

    spring mvc: json练习 本例需要用到的json包: 如下: jackson-databind jackson-core jackson-annotations <!-- https ...

  3. Performance js

    转贴:https://10up.github.io/Engineering-Best-Practices/javascript/#performance Performance Writing per ...

  4. LM3S之boot loader学习笔记-2

    LM3S之boot loader学习笔记-2 彭会锋 () 上一篇中介绍了bootloader的基础知识,对于bootloader的作用和如何编写bootloader也有了大概的了解了,这一篇主要讲解 ...

  5. 《深入理解mybatis原理6》 MyBatis的一级缓存实现详解 及使用注意事项

    <深入理解mybatis原理> MyBatis的一级缓存实现详解 及使用注意事项 0.写在前面   MyBatis是一个简单,小巧但功能非常强大的ORM开源框架,它的功能强大也体现在它的缓 ...

  6. nyoj——5字符串STL复习

    Binary String Matching 时间限制:3000 ms  |  内存限制:65535 KB 难度:3   描述 Given two strings A and B, whose alp ...

  7. maven_00_资源帖

    一.官方资料 Maven Getting Started Guide 二.精选资料 Maven for building Java applications - Tutorial Maven Tuto ...

  8. Python3的第一个程序(三)

    现在,了解了如何启动和退出Python的交互式环境,我们就可以正式开始编写Python代码了. 在写代码之前,请千万不要用“复制”-“粘贴”把代码从页面粘贴到你自己的电脑上.写程序也讲究一个感觉,你需 ...

  9. ant+jmeter+jenkins+git持续集成以及邮件报告展示

    前序准备工作: ant--下载地址:http://ant.apache.org/bindownload.cgi jmeter--下载地址:http://jmeter.apache.org/downlo ...

  10. PostgreSQL CPU满(100%)性能分析及优化(转)

    PostgreSQL CPU满(100%)性能分析及优化 转自:https://help.aliyun.com/knowledge_detail/43562.html    在数据库运维当中,一个DB ...