• AngularJS特点

    • 遵循AMD规范
    • 不需要操作节点
    • 对于jquery，一般是利用现有完整的DOM，然后在这戏Dom的基础上进行二次调教了；而对于AngularJS等框架则是根据数据模型以及其对应用dom模板，而后通过模板类似于搭积木那样组合页面。
    • 不适合频繁dom操作的应用。

  • {{}} Angular的表达式

  • 借鉴mvc理念；仅仅只是借鉴，区别在于控制C，Angular弱化了控制器

    • mvvm

      • vm：viewModel，$scope 是一个对象
    • 官方解释 mvw
      • w：whatever，$scope 是什么都无所谓，都可以

  • <html ng-app>

  • 最早是由backbone提出该理念，但封装不够彻底

  • ng-model 双向绑定，只有能在页面下可操作的标签才能双向保定 ##原理

  • $watch

    • 监听列表
    • 页面上所有绑定到页面上的{{}}、ng-model等都会加入监听列表,根据数据变化，来改变页面显示。
    • <pre> scope.age=20; $scope.$watch('age',function(newValue,oldValue){ console.info(‘监听age’); });</pre>

  • $digest

    • 循环监听列表，当发现监听值发生变化，调用相应回调函数，进行dom操作
    • 需要在anguler上下文环境中才能启动
    • 每次循环到有值的改变，会重新循环，所以为了保证效率，尽量不要让数据相互影响。相互影响超过10次angular会报错。

  • $apply

    • 把环境改变为angular的上下文环境
    • <pre> $scope.$apply(function(){ (angular上下文环境) }); </pre>

mvc

  • model（模型） view（视图） controller（控制器）
  • model相当于数据，view呈现model里的数据，controller是连接model和iew之间的传输

$scope

  • 是一个对象
  • 可以嵌套
  • 顶层$rootScrope,就近原则查找属性，最终查到$rootScrope，没有不会报错
  • function($scope){};依赖注入,被动获取

$index

获取选中节点序号

过滤器

过滤器（filter）正如其名，接受一个输入，通过某种规则处理后，返回处理后的结果。

  • currency
  • date
  • filter
  • json
  • limitTo
  • lowercase
  • uppercase
  • number
  • orderBy

directive

测试指令，在css里面写一个.red；在html中调用ng-class="{red:true}";

  • ng-class
  • ng-style
  • ng-show
  • ng-hide ##事件## 给$scope对象添加一个属性，属性为一个函数，在html中ng-click="调用该函数"。 *ng-click

AJAX $http

  • $http.get("/users/router?username="+$scope.username").success(function(){});
  • $http.post("/users/router",{name:xiaoming,pwd:123456}).success(function(){});

AngularJS初步的更多相关文章

  1. AngularJs初步学习笔记（part1）

    一.摘要: angular是采用JavaScript编写的前端mvc框架,帮助开发者编写现代化的单页面应用.它尤其适用编写有大量CRUD操作的,具有Ajax风格的客户端应用. 二.总结: Angula ...

  2. 【原创教程】鲸吞HTML

    首先,我们的angularJS课程分为三大模块: HTML/CSS/JS基础. angularJS详解. angualrJS的一些实用框架讲解. 其中,第一大模块的对象是对前端开发技术有点了解但不熟悉 ...

  3. AngularJS的初步学习（1）

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

  4. angularjs e2e测试初步学习（一）

    e2e测试是从用户角度出发,认为整个系统都是一个黑盒,只有UI暴露出来. angularjs的测试框架是采用protractor. 1.创建文件 首先创建一个项目文件夹test,然后再创建两个文件,一 ...

  5. 剖析AngularJS作用域

    一.概要 在AngularJS中,子作用域(child scope)基本上都要继承自父作用域(parent scope). 但,事无绝对,也有特例,那就是指令中scope设置项为对象时,即scope: ...

  6. AngularJS 脏检查深入分析

    写在开头 关于Angular脏检查,之前没有仔细学习,只是旁听道说,Angular 会定时的进行周期性数据检查,将前台和后台数据进行比较,所以非常损耗性能. 这是大错而特错的.我甚至在新浪前端面试的时 ...

  7. 摆脱DOM操作，从TodoMVC看angularJS

    取代jQuery? 我很久之前便听说了angularJS的大名,之前的leader也经常感叹angularJS的设计如何如何精妙,可叹一直没有机会深入了解,国庆长假因为没钱出游,倒是可以对他做一个了解 ...

  8. 提高前端开发效率必备AngularJS （基础）

    简介 AngularJS 是一个为动态WEB应用设计的结构框架,提供给大家一种新的开发应用方式,这种方式可以让你扩展HTML的语法,以弥补在构建动态WEB应用时静态文本的不足,从而在web应用程序中使 ...

  9. 基于AngularJS的企业软件前端架构[转载]

    这篇是我参加QCon北京2014的演讲内容: 提纲: 企业应用在软件行业中占有很大的比重,而这类软件多数现在也都采用B/S的模式开发,在这个日新月异的时代,它们的前端开发技术找到了什么改进点呢? B/ ...

随机推荐

  1. C#。3 循环

    循环:可以反复执行某段代码,直到不满足循环条件为止. 一.循环的四要素:初始条件.循环条件.状态改变.循环体. 1.初始条件:循环最开始的状态. 2.循环条件:在什么条件下进行循环,不满足此条件,则循 ...

  2. 规约模式(Specification Pattern)

    前期准备之规约模式(Specification Pattern) 一.前言 在专题二中已经应用DDD和SOA的思想简单构建了一个网上书店的网站,接下来的专题中将会对该网站补充更多的DDD的内容.本专题 ...

  3. avalon

    http://avalonjs.coding.me/ 有时间详细写

  4. [转]Xcode的重构功能

    Xcode提供了以下几个重构功能: Rename Extract Create Superclass Move Up Move Down Encapsulate 在菜单栏中的位置如下图: 在代码区里直 ...

  5. spark原理介绍

    1.spark是一个基于内存计算的开源的集群计算系统,目的是让数据分析更加快速.因此运行spark的机器应该尽量的大内存,如96G以上. 2.spark所有操作均基于RDD,操作主要分成2大类:tra ...

  6. nRF51 DFU 初始化包介绍及生成工具

    nRF51 DFU 初始化包 当升级数据包时,在应用程序映像传输之前,在DFU中需要初始化包来执行映像的安全检测.这个初始化包作为升级流程的一部分提供了安全检测机制,因此被升级的设备只能接收兼容的应用 ...

  7. 在jsp页面中使用自定义标签

    在某些场景中,自定义标签可封装大量代码,使页面变得更简洁,标签也可以很方便地在不同页面中实现通用而不必去粘贴大量的js代码.现在把最近做的一个自定义标签在这里总结一下.首先总结一下关于自定义标签的一些 ...

  8. Android中实现全屏、无标题栏的两种办法（另附Android系统自带样式的解释）

    在进行UI设计时,我们经常需要将屏幕设置成无标题栏或者全屏.要实现起来也非常简单,主要有两种方法:配置xml文件和编写代码设置. 1.在xml文件中进行配置 在项目的清单文件AndroidManife ...

  9. Linux企业级项目实践之网络爬虫（3）——设计自己的网络爬虫

    网络抓取系统分为核心和扩展组件两部分.核心部分是一个精简的.模块化的爬虫实现,而扩展部分则包括一些便利的.实用性的功能.目标是尽量的模块化,并体现爬虫的功能特点.这部分提供简单.灵活的API,在基本不 ...

  10. 【转】Android开源项目发现---ListView篇（持续更新）

    原文网址:http://blog.csdn.net/krislight/article/details/20211045 资料转载地址:https://github.com/Trinea/androi ...