Angularjs通过新的属性和表达式扩展了html

Andularjs 可以构建一个单一页面的应用程序（SPAS SinglePageApplications）

Angularjs通过指令扩展了html，通过表达式绑定数据到html

ng-app指令定义Angularjs的应用程序

ng-model指令绑定元素值到应用程序

ng-bind指令把应用程序数据绑定到html视图

    <div ng-app="">

      <input type="text" ng-model="name">

      <p ng-bind="name"></p>

    </div>

AngularJs的指令是以ng作为前缀的html属性

ng-init指令初始化AngularJs应用程序的变量

AngularJs的表达式写在双大括号内：{{表达式}}

AngularJs的表达式把数据绑定到html，这与ng-bind指令有异曲同工之妙

AngularJs将在表达式输出的定义的位置输出数据

    <div ng-app="" ng-init="myName='taoshihan'">

      <input type="text" ng-model="name">

      <p ng-bind="name"></p>

      <p ng-bind="myName"></p>

      <p>{{5+5}}</p>

    </div>

AngularJs模块（Module）定义了AngularJs应用

AngularJs控制器（Controller）用于控制AngularJs应用

ng-app指令定义了应用，ng-controller指令定义了控制器

  <body>

    <div ng-app="Home" ng-controller="index">

      <p>{{myName}}</p>

    </div>

  </body>

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

  <script type="text/javascript">

  //实例化应用对象，参数：模块名，空数组

  var app=angular.module("Home",[]);

  //调用应用对象的controller()方法，参数：控制器名，回调函数

  app.controller("index",function($scope){

    $scope.myName="taoshihan";

  })

  </script>

[angularjs] angularjs系列笔记（一）简介的更多相关文章

  1. angularjs自动化测试系列之jasmine

    angularjs自动化测试系列之jasmine jasmine参考 html <!DOCTYPE html> <html lang="en"> <h ...

  2. angularjs自动化测试系列之karma

    angularjs自动化测试系列之karma karma test with jasmine 更好的利用工具是为了让生活更美好. 需要安装的东西: npm install karma -g mkdir ...

  3. AngularJS路由系列(6)-- UI-Router的嵌套State

    本系列探寻AngularJS的路由机制,在WebStorm下开发.本篇主要涉及UI-Route的嵌套State. 假设一个主视图上有两个部分视图,部分视图1和部分视图2,主视图对应着一个state,两 ...

  4. AngularJS路由系列(5)-- UI-Router的路由约束、Resolve属性、路由附加数据、路由进入退出事件

    本系列探寻AngularJS的路由机制,在WebStorm下开发.主要包括: ● UI-Router约束路由参数● UI-Router的Resolve属性● UI-Router给路由附加数据● UI- ...

  5. AngularJS路由系列(4)-- UI-Router的$state服务、路由事件、获取路由参数

    本系列探寻AngularJS的路由机制,在WebStorm下开发.主要包括: ● UI-Router的$state服务● UI-Router的路由事件● UI-Router获取路由参数 Angular ...

  6. AngularJS路由系列(3)-- UI-Router初体验

    本系列探寻AngularJS的路由机制,在WebStorm下开发. AngularJS路由系列包括: 1.AngularJS路由系列(1)--基本路由配置2.AngularJS路由系列(2)--刷新. ...

  7. AngularJS路由系列(2)--刷新、查看路由,路由事件和URL格式，获取路由参数，路由的Resolve

    本系列探寻AngularJS的路由机制,在WebStorm下开发.主要包括: ● 刷新路由● 查看当前路由以及所有路由● 路由触发事件● 获取路由参数 ● 路由的resolve属性● 路由URL格式 ...

  8. AngularJS路由系列(1)--基本路由配置

    本系列探寻AngularJS的路由机制,在WebStorm下开发.主要包括: ● 路由的Big Picture ● $routeProvider配置路由 ● 使用template属性 ● 使用temp ...

  9. 跟我学AngularJs:AngularJs入门及第一个实例

    林炳文Evankaka原创作品.转载请注明出处http://blog.csdn.net/evankaka 摘要:主要给大家介绍了AngularJs及其特性,并以3个实例来做说明. 本教程使用Angul ...

  10. Vim 系列笔记一

    Vim 系列笔记一 Vim 简介 什么是VIM ? Vim 是从 Vi 发展出来的一个编辑器,是 Vi 的升级版.而 vi 则是 Unix .类Unix(Linux)系统中自带的编辑器. Vim/Vi ...

随机推荐

  1. HAProxy详细中文用法详解

    一.HAProxy简介 (1)HAProxy 是一款提供高可用性.负载均衡以及基于TCP(第四层)和HTTP(第七层)应用的代理软件,支持虚拟主机,它是免费.快速并且可靠的一种解决方案. HAProx ...

  2. 深入浅出Redis

    一.Redis的诞生 Redis创建者,出生于西西里岛的意大利人(antirez)发明的,个人网站,http://invece.org.早年是系统管理员,2004-2006 年做嵌入式方面的工作,之后 ...

  3. Javascript高级编程学习笔记（38）—— DOM（4）Text

    Text类型 html页面中的纯文本内容就属于Text类型 纯文本内容可以包含转义后的html字符,但不能包括 html 代码 text类型具有以下属性.方法 nodeType:3 nodeName: ...

  4. 吴恩达机器学习笔记42-大边界的直观理解(Large Margin Intuition)

    这是我的支持向量机模型的代价函数,在左边这里我画出了关于

  5. SpringBoot 项目打包后运行报 org.apache.ibatis.binding.BindingException

    今天把本地的一个SpringBoot项目打包扔到Linux服务器上,启动执行,接口一访问就报错,但是在本地Eclipse中启动执行不报错,错误如下: org.apache.ibatis.binding ...

  6. 写给深圳首期Python自动化开发周未班的信

    你是否做了正确的决定? 深圳首期周未班的同学们大家好,我是Alex, 老男孩教育的联合创始人,Python项目的发起人,51CTO学院连续2届最受学员喜爱的讲师,中国最早一批使用Python的程序员, ...

  7. python数字图像处理---噪声的应用

    数字图像的随机噪声在图像处理中有着重要的位置,今天用到了,就回顾一下.做个总结. 随机噪声很多种,最常用的一般有两种,高斯噪声和椒盐噪声,下面我们就针对这两种噪声做个科普. 高斯噪声:高斯噪声是指它的 ...

  8. Java 基础：hashCode方法

    Writer:BYSocket(泥沙砖瓦浆木匠) 微博:BYSocket 豆瓣:BYSocket 一.前言 泥瓦匠最近被项目搞的天昏地暗.发现有些要给自己一些目标,关于技术的目标: 专注很重要.专注J ...

  9. 知其然而所以然：Operating System 概述和学习图

    大神绕道,鄙人初入 OS . 一.想知OS,先知计算机系统概述 #图解 #基本指令和中断周期 #直接内存存取(Direct Memory Access,DMA) I/O模块对存储器发出读命令或者写命令 ...

  10. 使用ES6新数组方法(象C# Lambda表达式一样写查询语句)

    let people = [ {id: 1, name: "a", age: 12}, {id: 2, name: "b", age: 13}, {id: 3, ...