angular的第二讲
一、angular的基本用法
1、controller控制器语法结构
(1)AngularJS1.x的核心之一就是控制器部分,主要对于视图中的数据和事件处理函数进行挂载,同时进行一定的业务功能的底层封装和处理。
var app=angular.module("myApp",[]); app.controller("myCtrl",function($scope){
// 控制器函数操作部分 // 控制器主要进行数据的初始化操作和事件函数的定义
})
2、$scope的作用域
(1)$scope作为控制器函数一个非常重要的参数,AngularJS通过依赖注入的方式进行自动赋值,挂载数据完成控制器中的数据处理。每个$scope都拥有自己控制器的作用域,并且都独立于当前的控制器$scope挂载变量的情况下:
通过控制器函数中的$scope参数,直接将JS变量添加到$scope对象上。
例、$scope.name = “jerry”;
这里name是变量名称,jerry是变量值;变量值可以是字面量直接赋值,也可以是后端接口获取数据之后进行赋值
$scope挂载事件处理函数的情况下:
通过Angular的事件指令,在指定的DOM元素上挂载事件,然后在$scope作用域对象上挂载事件处理函数,完成事件的完整流程操作。
例、<div ng-click=”clickMe()”>点击我</div>
$scope.clickMe = function() {..}
补充:可以通过$event来传递一个事件对象,方便在Angular中通过事件对象进行后续更多功能的操作。
<div ng-click=”clickMe($event)”>点击我</div>
3、$rootScope作用域
每一个AngularJS应用,都有唯一的一个全局作用域范围,也称为根作用域,Angular中其他的作用域都是这个根作用域的后代/子作用域。
AngularJS的根作用域/全局作用域:$rootScope
根作用域使用时,通过注入的方式添加到控制器处理函数的入参中。
angular.module.run(fn);
在AngularJS中,有一个特殊的函数run(),用于进行全局的数据处理,结合$rootScope一起用来初始化全局数据,这些数据可以被模块下所有的子模块和控制器共享。