JavaScript---Angular 和JQuery

Angular  三层模式 M model和data 数据层 ， V view 视图层 ， C controller  控制器，程序主逻辑 ,通过指令扩展HTML，通过表达式绑定数据到HTML。

View(视图), 即 HTML。

Model(模型), 当前视图中可用的数据，在表达式输出数据。

Controller(控制器), 即 JavaScript 函数，可以添加或修改属性。

Angular 指令：（AngularJS 指令是扩展的 HTML 属性，带有前缀 ng-。 ）

AngularJS 通过被称为 指令 的新属性来扩展 HTML。

AngularJS 通过内置的指令来为应用添加功能。

AngularJS 允许你自定义指令。

angular 表达式：

数据绑定表达式{{ firstName }} 是通过 ng-model="firstName" 进行同步。

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

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

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

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

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

AngularJS 应用

AngularJS 模块（Module） 定义了 AngularJS 应用。

AngularJS 控制器（Controller） 用于控制 AngularJS 应用。

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

AngularJS 模块定义应用:

var app = angular.module('myApp', []);

AngularJS 控制器是控制定义的应用程序的:

app.controller('myCtrl', function($scope) {

$scope.firstName= "John";

});

Scope(作用域) 是应用在 HTML (视图) 和 JavaScript (控制器)之间的纽带。（angular以数据为中心，通过试图和控制器来求数据）

Scope 是一个对象，有可用的方法和属性。这些属性和方法可以在视图和控制器中使用。视图中，你不需要添加 $scope 前缀, 只需要添加属性名即可，如： {{carname}}。

当你在 AngularJS 创建控制器时，你可以将 $scope 对象当作一个参数传递。

$rootScopege根作用域 相当于全局变量，可以在各个 controller 中使用。

常用指令

ng-app 指令初始化一个 AngularJS 应用程序，定义了 AngularJS 应用程序的 根元素。

ng-bind  输出数据，相当于{{}}；

ng-init 指令初始化应用程序数据。

ng-model 指令把元素值（比如输入域的值）绑定到应用程序。

ng-repeat 指令会重复一个 HTML 元素。

循环数组<p ng-repeat="x in arr">{{x}}</p>

ng-controlle 指令定义了应用程序控制器

事件指令

ng-click=’toggle()’; 点击事件

ng-hide(ng-show)="myVar" 设置 HTML 元素不可见。False可见。

$scope.toggle = function() {

$scope.myVar = !$scope.myVar;  开关a=!a;

};

ng-disabled  直接绑定应用程序数据（例如true或false）到 HTML 的 disabled 属性   true是不可用变灰，false 是可用   eg：

<p>

<button ng-disabled="a">点我!</button>

</p>

<p>

<input type="checkbox" ng-model="a">按钮

体会：ng-model 指令把元素值（比如输入域的值）绑定到应用程序。

</p>

ng-change 表单元素发生改变的事件

过滤器：

{{a|limitTo:2}}  限制数量

{{a|lowercase}} 小写

{{a|currency:'rmb'}} 转为货币

HTTP

app.controller(“myapp”,function($scope,$http){

//取数据

$http.get('url').success(function(str){

$scope.a = str;

});

});

控制器的嵌套继承  子级可以用父级的作用域，但是父级用不了子级，需要发送和接受

Eg：app.controller('aaa',function($scope){  父级

//$scope.a = 12;

$scope.$on('data',function(event,data){

$scope.a = data+1;

});

});

app.controller('bbb',function($scope){ 子级

$scope.c = function(){

$scope.$emit('data',$scope.a);  向父级发送

$scope.$broadcast('data',$scope.a); 向子级传送

});

小问题：$setTimeout() 需要包一下