)
Scope(作用域) 是應用在 HTML (視圖) 和 JavaScript (控制器)之間的紐帶。Scope 是一個對象有可用的方法和屬性。Scope 可應用在視圖和控制器上。如何使用 Scope當你在 AngularJS 創(chuàng)建控制器時你可以將$scope對象當作一個參數(shù)傳遞:AngularJS 實例控制器中的屬性對應了視圖上的屬性div ng-appmyApp ng-controllermyCtrlh1{{carname}}/h1/divscriptvar app angular.module(myApp, []);app.controller(myCtrl, function($scope) {$scope.carname Volvo;});/script嘗試一下 ?當在控制器中添加$scope對象時視圖 (HTML) 可以獲取了這些屬性。視圖中你不需要添加$scope前綴, 只需要添加屬性名即可如{{carname}}。Scope 概述AngularJS 應用組成如下View(視圖), 即 HTML。Model(模型), 當前視圖中可用的數(shù)據(jù)。Controller(控制器), 即 JavaScript 函數(shù)可以添加或修改屬性。scope 是模型。scope 是一個 JavaScript 對象帶有屬性和方法這些屬性和方法可以在視圖和控制器中使用。AngularJS 實例如果你修改了視圖模型和控制器也會相應更新div ng-appmyApp ng-controllermyCtrl input ng-modelname h1{{greeting}}/h1 button ng-clicksayHello()點我/button /div scriptvar app angular.module(myApp, []); app.controller(myCtrl, function($scope) { $scope.name Runoob; $scope.sayHello function() { $scope.greeting Hello $scope.name !; }; });/script嘗試一下 ?Scope 作用范圍了解你當前使用的 scope 是非常重要的。在以上兩個實例中只有一個作用域 scope所以處理起來比較簡單但在大型項目中 HTML DOM 中有多個作用域這時你就需要知道你使用的 scope 對應的作用域是哪一個。AngularJS 實例當我們使用ng-repeat指令時每個重復項都訪問了當前的重復對象:div ng-appmyApp ng-controllermyCtrlulli ng-repeatx in names{{x}}/li/ul/divscriptvar app angular.module(myApp, []);app.controller(myCtrl, function($scope) {$scope.names [Emil, Tobias, Linus];});/script嘗試一下 ?每個li元素可以訪問當前的重復對象這里對應的是一個字符串 并使用變量x表示。根作用域所有的應用都有一個$rootScope它可以作用在ng-app指令包含的所有 HTML 元素中。$rootScope可作用于整個應用中。是各個 controller 中 scope 的橋梁。用 rootscope 定義的值可以在各個 controller 中使用。AngularJS 實例創(chuàng)建控制器時將 $rootScope 作為參數(shù)傳遞可在應用中使用div ng-appmyApp ng-controllermyCtrlh1{{lastname}} 家族成員:/h1ulli ng-repeatx in names{{x}} {{lastname}}/li/ul/divscriptvar app angular.module(myApp, []);app.controller(myCtrl, function($scope, $rootScope) {$scope.names [Emil, Tobias, Linus];$rootScope.lastname Refsnes;});/script嘗試一下 ? HoRain云--AngularJS Scope(作用域)
Scope(作用域) 是應用在 HTML (視圖) 和 JavaScript (控制器)之間的紐帶。Scope 是一個對象有可用的方法和屬性。Scope 可應用在視圖和控制器上。如何使用 Scope當你在 AngularJS 創(chuàng)建控制器時你可以將$scope對象當作一個參數(shù)傳遞:AngularJS 實例控制器中的屬性對應了視圖上的屬性div ng-appmyApp ng-controllermyCtrlh1{{carname}}/h1/divscriptvar app angular.module(myApp, []);app.controller(myCtrl, function($scope) {$scope.carname Volvo;});/script嘗試一下 ?當在控制器中添加$scope對象時視圖 (HTML) 可以獲取了這些屬性。視圖中你不需要添加$scope前綴, 只需要添加屬性名即可如{{carname}}。Scope 概述AngularJS 應用組成如下View(視圖), 即 HTML。Model(模型), 當前視圖中可用的數(shù)據(jù)。Controller(控制器), 即 JavaScript 函數(shù)可以添加或修改屬性。scope 是模型。scope 是一個 JavaScript 對象帶有屬性和方法這些屬性和方法可以在視圖和控制器中使用。AngularJS 實例如果你修改了視圖模型和控制器也會相應更新div ng-appmyApp ng-controllermyCtrl input ng-modelname h1{{greeting}}/h1 button ng-clicksayHello()點我/button /div scriptvar app angular.module(myApp, []); app.controller(myCtrl, function($scope) { $scope.name Runoob; $scope.sayHello function() { $scope.greeting Hello $scope.name !; }; });/script嘗試一下 ?Scope 作用范圍了解你當前使用的 scope 是非常重要的。在以上兩個實例中只有一個作用域 scope所以處理起來比較簡單但在大型項目中 HTML DOM 中有多個作用域這時你就需要知道你使用的 scope 對應的作用域是哪一個。AngularJS 實例當我們使用ng-repeat指令時每個重復項都訪問了當前的重復對象:div ng-appmyApp ng-controllermyCtrlulli ng-repeatx in names{{x}}/li/ul/divscriptvar app angular.module(myApp, []);app.controller(myCtrl, function($scope) {$scope.names [Emil, Tobias, Linus];});/script嘗試一下 ?每個li元素可以訪問當前的重復對象這里對應的是一個字符串 并使用變量x表示。根作用域所有的應用都有一個$rootScope它可以作用在ng-app指令包含的所有 HTML 元素中。$rootScope可作用于整個應用中。是各個 controller 中 scope 的橋梁。用 rootscope 定義的值可以在各個 controller 中使用。AngularJS 實例創(chuàng)建控制器時將 $rootScope 作為參數(shù)傳遞可在應用中使用div ng-appmyApp ng-controllermyCtrlh1{{lastname}} 家族成員:/h1ulli ng-repeatx in names{{x}} {{lastname}}/li/ul/divscriptvar app angular.module(myApp, []);app.controller(myCtrl, function($scope, $rootScope) {$scope.names [Emil, Tobias, Linus];$rootScope.lastname Refsnes;});/script嘗試一下 ?