【angularJS】简介

简介

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

 

转载于:https://www.cnblogs.com/peterYong/p/10098845.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/388972.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

爬取淘宝商品信息selenium+pyquery+mongodb

爬取淘宝商品信息,通过selenium获得渲染后的源码,pyquery解析,mongodb存储 from selenium import webdriver from selenium.webdriver.common.by import By from selenium.webdriver.support import expected_conditions as EC from selenium.common.exceptions import Timeout…

纹个鸡儿天才小熊猫_给熊猫用户的5个提示

纹个鸡儿天才小熊猫A popular Python library used by those working with data is pandas, an easy and flexible data manipulation and analysis library. There are a myriad of awesome methods and functions in pandas, some of which are probably less well-known tha…

本人服务器遭受黑客长期攻击,特把这几天做的一些有用的安全方面总结出来,以方便以后查阅

消息队列iis360northrarsql2000 netscren本人服务器遭受黑客长期攻击&#xff0c;特把这几天做的一些有用的安全方面总结出来&#xff0c;以方便以后查阅&#xff0c;希望这次彻底解觉黑客的攻击&#xff0c;特次谢谢“冷雨夜”的一些提示。 windows 2003服务器安全设置方法 0…

用户与用户组管理

linux最优秀的地方之一&#xff0c;就在于他的多用用户、多任务环境。 用户及用户组的概念 1、文件所有者 由于linux是一个多用户、多任务的系统。因此可能常常会有很多人同时使用这台主机来进行工作的情况发生&#xff0c;为了考虑每个人的隐私权以及每个人的喜好的工作环境&a…

代码 抠图_3 行 Python 代码 5 秒抠图的 AI 神器,根本无需 PS,附教程

曾几何时&#xff0c;「抠图」是一个难度系数想当高的活儿&#xff0c;但今天要介绍的这款神工具&#xff0c;只要 3 行代码 5 秒钟就可以完成高精度抠图&#xff0c;甚至都不用会代码&#xff0c;点两下鼠标就完成了。感受下这款抠图工具抠地有多精细&#xff1a;是不是很赞&a…

python函数使用易错举例

关于嵌套&#xff1a; 嵌套使用中&#xff0c; retrun inner ---> 返回的是函数的地址 retrun inner() &#xff1a; ---> 运行inner()函数 ---> 运行inner()函数后的返回值a&#xff08;假设&#xff09;返回上级 --> retrun inner()得到返回值a 如…

图像离群值_什么是离群值?

图像离群值你是&#xff01; (You are!) Actually not. This is not a text about you.其实并不是。 这不是关于您的文字。 But, as Gladwell puts it in Outliers, if you find yourself being that type of outlier, you’re quite lucky. And rare.但是&#xff0c;正如Gla…

混合模型和EM---混合高斯

2019独角兽企业重金招聘Python工程师标准>>> 混合高斯 最大似然 用于高斯混合模型的EM 转载于:https://my.oschina.net/liyangke/blog/2986520

永恒python地速_立竿见影地把你的 Python 代码提速7倍

之前曾经测试计算斐波那契数列的几种方法&#xff0c;其中基于递归的方法是速度最慢的&#xff0c;例如计算第 40 项的值&#xff0c;需要 36 秒。如下图所示。要提高运算速度&#xff0c;根本办法当然是改进算法。不过算法的提高是一个长期积累加上灵机一动的过程。我们今天要…

顶尖大学实验室的科研方法_这是来自顶尖大学的5门免费自然语言处理课程

顶尖大学实验室的科研方法Data Science continues to be a hot topic, but more specifically, Natural Language Processing (NLP) is increasing in demand.数据科学仍然是一个热门话题&#xff0c;但更具体地说&#xff0c;自然语言处理(NLP)的需求正在增长。 Broadly spea…

Python学习---django知识补充之CBV

Django知识补充之CBV Django: url --> def函数 FBV[function based view] 用函数和URL进行匹配 url --> 类 CBV[function based view] 用类和URL进行匹配 POSTMAN插件 http://blog.csdn.net/zzy1078689276/article/details/77528249 基于CBV的登…

「CH2101」可达性统计 解题报告

CH2101 可达性统计 描述 给定一张N个点M条边的有向无环图&#xff0c;分别统计从每个点出发能够到达的点的数量。N,M≤30000。 输入格式 第一行两个整数N,M&#xff0c;接下来M行每行两个整数x,y&#xff0c;表示从x到y的一条有向边。 输出格式 共N行&#xff0c;表示每个点能够…

蓝图解锁怎么用_[UE4蓝图][Materials]虚幻4中可互动的雪地材质完整实现(一)

不说废话&#xff0c;先上个演示图最终成果&#xff08;脚印&#xff0c;雪地可慢慢恢复&#xff0c;地形可控制&#xff09;主要原理&#xff08;白话文&#xff09;&#xff1a;假如你头上是块白色并且可以透视的平地&#xff0c;来了个非洲兄弟踩上面&#xff0c;你拿起单反…

数据预处理工具_数据预处理

数据预处理工具As the title states this is the last project from Udacity Nanodegree. The goal of this project is to analyze demographics data for customers of a mail-order sales company in Germany.如标题所示&#xff0c;这是Udacity Nanodegree的最后一个项目。…

这几日英文大汇

int > 整数. 主要⽤用来进⾏行行数学运算 str > 字符串串, 可以保存少量量数据并进⾏行行相应的操作 bool>判断真假, True, False list> 存储⼤大量量数据.⽤用[ ]表⽰示 tuple> 元组, 不可以发⽣生改变 ⽤用( )表⽰示 dict>字典,保存键值对,⼀一样可以…

在网上收集了一部分关于使用Google API进行手机定位的资料和大家分享

在网上收集了一部分关于使用Google API进行手机定位的资料和大家分享&#xff1a;关于基站定位方面的介绍&#xff1a;http://tech.c114.net/164/a140837.html开发方面的帮助&#xff1a;http://www.dotblogs.com.tw/kylin/archive/2009/08/09/9964.aspxhttp://code.google.com…

background图片叠加_css怎么让两张图片叠加,不用background只用img叠加

展开全部css层叠图片代码&#xff1a;//这个层为外面的父层&#xff0c;只需设置相对位置样式即可//这个为里e69da5e887aa3231313335323631343130323136353331333431363030面要叠加的层&#xff0c;只需设置绝对样式//这个为层里面的内容图片//这个为父层内容或者&#xff1a;扩…

“入乡随俗,服务为主” 发明者量化兼容麦语言啦!

5年时光 我们裹挟前行。发明者量化从筚路蓝缕到步履蹒跚&#xff0c;从以“区块链资产交易”为阵地&#xff0c;再到以“内外盘商品期货”为依托。再到今天全面兼容“麦语言”。每一步&#xff0c;我们始终都在为建立一个优秀的量化交易平台而努力。 什么是麦语言&#xff1f; …

自考数据结构和数据结构导论_我跳过大学自学数据科学

自考数据结构和数据结构导论A few months back, I decided I wanted to learn data science. In order to do this, I skipped an entire semester of my data science major.几个月前&#xff0c;我决定要学习数据科学。 为此&#xff0c; 我跳过了数据科学专业的整个学期。 …

爬取LeetCode题目——如何发送GraphQL Query获取数据

前言 GraphQL 是一种用于 API 的查询语言&#xff0c;是由 Facebook 开源的一种用于提供数据查询服务的抽象框架。在服务端 API 开发中&#xff0c;很多时候定义一个接口返回的数据相对固定&#xff0c;因此要获得更多信息或者只想得到某部分信息时&#xff0c;基于 RESTful AP…