1.第一个小例子

  

<!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="./angular.min.js"></script> </body>
</html>

实例讲解:

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

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

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

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

2.angular.js表达式

<!DOCTYPE html>
<html>
<body> <div ng-app="">
<p>我的第一个表达式{{+}}</p>
</div> <script src="./angular.min.js"></script> </body>
</html>

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

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

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

AngularJS 表达式 很像 JavaScript 表达式:它们可以包含文字、运算符和变量。

实例 {{ 5 + 5 }} 或 {{ firstName + " " + lastName }}

angular.js学习的更多相关文章

  1. 适合我胃口的angular.js学习资料

    断断续续弄了半年的ANGULAR.JS学习资料,网上下载了N多资料,测试了很多次. 现在只能算是入门,因时间问题,现在要转入其它领域. 如果以后要拾起来,下面这个PDF比较对我胃口. <Angu ...

  2. python , angular js 学习记录【1】

    1.日期格式化 Letter Date or Time Component Presentation Examples G Era designator Text AD y Year Year 199 ...

  3. angular.js学习的第一天

    第一天对angular.js进行学习,肯定是面对的入门的最简单的实例: 实现下面的这个效果,首先需要在html页面引入angular.js,在下面的div中,ng-app则表示在当前div是一个ang ...

  4. Angular JS 学习之路由

    1.AngularJS路由允许我们通过不同的URL访问不同的内容:通过AngularJS可以实现多视图的单页WEB访问(SPA) 2.通常我们的URL形式为http://runoob.com/firs ...

  5. Angular JS 学习之Bootstrap

    1.要使用Bootstrap框架,必须在<head>中加入链接: <link rel="stylesheet" href="//maxcdn.boots ...

  6. Angular JS学习之指令

    1.Angular JS通过称为指令的新属性来扩展HTML:通过内置的指令来为应用添加功能: 2.AngularJS指令:AngularJS指令是扩展的HTML属性,带有前缀ng-: **ng-app ...

  7. Angular JS学习之表达式

    1.Angular JS使用表达式把数据绑定到HTML: 2.Angular JS表达式写在双大括号中:{{expression}} **Angular JS表达式把数据绑定到HTML,这与ng-bi ...

  8. Angular JS 学习之简介

    1.Angular JS是一个JavaScript框架,它是一个以JavaScript编写的库,它可以通过<script>标签添加到HTML页面: <script src=" ...

  9. Angular JS 学习笔记(自定义服务:factory,Promise 模式异步请求查询:$http,过滤器用法filter,指令:directive)

    刚学没多久,作了一个小项目APP,微信企业号开发与微信服务号的开发,使用的是AngularJS开发,目前项目1.0版本已经完结,但是项目纯粹为了赶工,并没有发挥AngularJS的最大作用,这几天项目 ...

  10. Angular.js 学习笔记

    AngularJS 通过新的属性和表达式扩展了 HTML. AngularJS 可以构建一个单一页面应用程序. <!-- ng-app 指令定义一个 AngularJS 应用程序. ng-mod ...

随机推荐

  1. 使用pcs api往免费的百度网盘上传下载文件

    百度个人云盘空间大,完全免费,而且提供了pcs api供调用操作文件,在平时的项目里往里面保存一些文件是很实用的. 环境准备: 开通读写网盘的权限及获取access_token:http://blog ...

  2. text-align:justify小例子

    一个使用 text-align: justify; 使元素均匀分布的小例子: <!DOCTYPE html> <html lang="en"> <he ...

  3. Hdu1097(计算a的b次幂最后一位数值)

    #include <stdio.h> #include <math.h> int main() { int Num1,Num2; while(scanf("%d %d ...

  4. Struts2学习笔记--Struts2的体系结构

    1. Struts2体系结构 Struts是以前端控制器框架为主体的框架,用户的请求会通过控制器选择不同的Action类来执行具体的操作,在Action类中所有的Servlet对象(request.r ...

  5. repo init 时gpg: 无法检查签名:找不到公钥

    i found a solution here: http://www.marshut.com/wrrts/repo-release-1-12-4.html Sorry, I realized tod ...

  6. 关于nginx架构探究(2)

    nginx 数据结构 1.Hash table nginx 对虚拟主机的管理使用到了HASH数据结构,假设配置文件里有如下的配置. Server{ listen 192.168.0.1 server_ ...

  7. PCIE体系结构

    http://blog.sina.com.cn/s/articlelist_1685243084_3_1.html BAR寄存器 http://zhidao.baidu.com/link?url=rE ...

  8. Logstash 介绍

    Logstash 介绍: Logstash 是一个开源的数据收集引擎具有实时管道能力, Logstash 可以动态的统一数据从不同的来源和使数据规范化到你选择的目的地. 当Logstash 起初驾驭创 ...

  9. back_inserter的用法

    1,代码如下: #include<iostream> #include<list> #include<algorithm> #include<iterator ...

  10. JAVA车票管理系统(简单GUI)

    一.    需求分析 1.设计题目:车票管理系统 用JAVA语言和数据结构知识设计设计车票管理系统.要求如下所述: 一车站每天有n个发车班次,每个班次都有一个班次号(1.2.3…n),固定的发车时间, ...