scope rootScope

最新推荐文章于 2024-10-18 08:57:48 发布

原创最新推荐文章于 2024-10-18 08:57:48 发布 · 368 阅读

0 ·

CC 4.0 BY-SA版权

本文详细介绍了AngularJS应用的基本组成部分，包括视图(View)、模型(Model)、控制器(Controller)及作用域(Scope)等核心概念，并通过实例展示了它们之间的交互方式。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

AngularJS 应用组成

View（视图），即HTML

Model（模型），当前视图中可用的数据

Controller（控制器），即JavaScript 函数，可以添加货修改属性

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

根作用域

所有的应用都有一个$rootScope，作用在ng-app 指定包含的所有HTML 元素中。

$rootScope 可作用于整个应用中。是各个controller 中scope 的桥梁。

scope是angularJS中的作用域（其实就是存储数据的地方），类似JavaScript的原型链。搜索时，优先自己的scope，如果没有找到久沿着作用域链向上搜索，直至到达根作用域rootScope。

	<div ng-app="myApp" ng-controller="myCtrl">
	<p>Family {{firstName}}</p>
	<input ng-model="name">
		<ul>
			<li ng-repeat="x in names">{{x}} {{firstName}}</li>
		</ul>
		<button ng-click="sayName()">click me</div>
	</div>
	<script>
		angular.module("myApp",[]).controller("myCtrl",function($scope,$rootScope){
			$scope.names=["Adela","Tom","Ban"]
			$rootScope.firstName="Smith"
				$scope.fName="Smith"
			$scope.sayName=function(){
				$scope.firstName=$scope.name;
			}
		})
	</script>