Angular JS 学习之 Scope作用域

1.Scope作用域是应用在HTML（视图）和JavaScript（控制器）之间的纽带；

Scope是一个对象，有可用的方法和属性；

Scope可应用在视图和控制器上；

 

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

<div ng-app="" ng-controller="myCtrl">

<h1>{{carname}}</h1>

</div>

<script>

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

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

　　$scope.carname="Volvo";           //控制器中创建一个属性名 "carname"，对应了视图中使用 {{ }} 中的名称。

});

</script>

 

3.Scope概述：

**AngularJS应用组成如下：

(1)View(视图)，即HTML；

(2)Model(模型)，当前视图中可用的数据；

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

**scope是模型，是一个javaScript对象，带有属性和方法，这些属性和方法可以在视图中和控制器中使用；

 

4.Scope作用范围：

<div ng-app="" ng-controller="myCtrl">

<ul>

　　<li ng-repeat="x in name">{{x}}</li>

</ul>

</div>

<script>

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

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

　　$scope.name=['Emil','Tobias','Linus'];

});

</script>

 

5.根作用域：所有的应用都有一个$rootScope,它可以作用在ng-app指令包含的所有HTML元素中；

$rootScope可作用于整个应用中，是各个controller中scope的桥梁，用rootscope定义的值，可以在各个controller中使用；

<div ng-app="' ng-controller="myCtrl">

<h1>{{lastname}}家族成员：</h1>

<ul>

　　<li ng-repeat="x in names">{{x}} {{lastname}}</li>

</ul>

</div>

<script>

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

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

　　$scope.names=["Emil","Tobias","Linus"];

　　$rootscope.lastname="Refsnes";

});

</script>