简介

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. 【三小时学会Kubernetes!(三) 】Service实践

    服务Service Kubernetes 服务资源可以作为一组提供相同服务的 Pod 的入口.这个资源肩负发现服务和平衡 Pod 之间负荷的重任,如图 16 所示. 图16:Kubernetes 服务 ...

  2. js数组与字符串的相互转换

    一.数组转字符串 需要将数组元素用某个字符连接成字符串,示例代码如下: var a, b,c; a = new Array(a,b,c,d,e); b = a.join('-'); //a-b-c-d ...

  3. 为什么CPU要从单核发展到多核?

    前言 这里首先直接给出结论:CPU从单核发展到多核的原因是如果维持单核,则为了提高CPU性能只能不断提高时钟频率,从而会导致CPU功耗急速上升,导致机箱过热,来不及散热. 历史 2004年,Intel ...

  4. constructor&object 的联系与对比

    构造函数与对象 构造函数是类中的特殊成员函数,用于为对象分配内存.它可用于为数据成员提供值.创建对象时将调用构造函数.它与类具有相同的名称.构造函数不返回任何值. 构造函数是生成对象的模板,一个构造函 ...

  5. 搞懂分布式技术12:分布式ID生成方案

    搞懂分布式技术12:分布式ID生成方案 ## 转自: 58沈剑 架构师之路 2017-06-25 一.需求缘起 几乎所有的业务系统,都有生成一个唯一记录标识的需求,例如: 消息标识:message-i ...

  6. 常用js、jquery 语句(句型)

    1.动态更改设置属性(class  style 都是属性) $("#sendPhoneNum").attr("class", "n_input3&qu ...

  7. datagrid与DropDownList关联使用

    最近做一个页面需要用到这个两个控件,之前虽然看过,但是没有动手实践过.突然要做这么一个页面,并用上,真的有点着急.于是乎,网上疯狂找datagrid与DropDownList 的例子,找了很多很多,看 ...

  8. poj 1258 Agri-Net 最小生成树 prim算法+heap不完全优化 难度:0

    Agri-Net Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 41230   Accepted: 16810 Descri ...

  9. Linux安装apue.3e(基于ubuntu16.0.4)

    本菜刚刚学习UNIX高级编程,无奈搭建本书编程环境时遇到不少问题,参考了网上各路大神的解决办法,最终解决了问题. (1)下载源代码,可以去官网下载:http://apuebook.com/code3e ...

  10. 网页宽高clientWidth clientHeight获得数值不对的问题

    当网页内容撑不满一屏时,通过以下代码获得整个网页高度会有问题 document.body.clientHeight;document.body.clientWidth; 得到的宽高不对,可能是因为ht ...