日韩av黄I国产麻豆传媒I国产91av视频在线观看I日韩一区二区三区在线看I美女国产在线I麻豆视频国产在线观看I成人黄色短片

歡迎訪問 生活随笔!

生活随笔

當(dāng)前位置: 首頁 >

angularjs探秘五 举足轻重的scope

發(fā)布時間:2023/12/15 44 豆豆
生活随笔 收集整理的這篇文章主要介紹了 angularjs探秘五 举足轻重的scope 小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.

scope在angular中的作用可謂舉足輕重,不理解scope就不會angular;

scope是應(yīng)用在 HTML (view) 和 JavaScript (controller)之間的紐帶。

scope是一個js對象(pojo),有可用的方法和屬性(即定義在controller中的所有屬性和函數(shù))。

對于scope的定義和作用在第三篇有提到過。

scope在定義controller時首先被注入,然后作為參數(shù)被引用,controller中的所有屬性和函數(shù)皆以scope為對象聲明的屬性和函數(shù),在view(HTML)中使用controller的屬性及函數(shù)都不需要加scope

<div ng-controller="contr_1"><ul ng-repeat="x in list"><li ng-bind="x"></li></ul></div> MyApp.controller("contr_1",["$scope",function($scope){$scope.list=['html','javascript','jquery','css','angularjs'];$scope.c1_title="標(biāo)題C1"; }]);

========================================================================================================================================

scope的作用范圍

先看個例子:

MyApp.controller("contr_1",["$scope",function($scope){$scope.c1_title="標(biāo)題C1"; }]);MyApp.controller("contr_2",["$scope",function($scope){$scope.c2_title="標(biāo)題C2"; }]); <div ng-controller="contr_1"><h1 ng-bind="c1_title"></h1> <!--顯示 標(biāo)題C1--></div><div ng-controller="contr_2"><h1 ng-bind="c1_title"></h1> <!--不顯示--><h1 ng-bind="c2_title"></h1> <!--顯示 標(biāo)題C2--></div>

這個例子中 contr_1 的作用范圍僅是 contr_1 所屬的div的范圍,所以第二個 c1_title 獲取不到值scope超出范圍了。

========================================================================================================================================

根scope

根scope存在于ng-app上,也就是說ng-app范圍有多大,根scope作用范圍就有多大;ng-app一個頁面有且只有一個,同樣根scope也是有且只有一個。

<div ng-controller="contr_1"><h1 ng-bind="c1_title"></h1> <!--顯示 標(biāo)題C1--><h1 ng-bind="title"></h1> <!--顯示 我是全局scope--></div><div ng-controller="contr_2"><h1 ng-bind="title"></h1> <!--顯示 我是全局scope--><h1 ng-bind="c1_title"></h1> <!--不顯示--><h1 ng-bind="c2_title"></h1> <!--顯示 標(biāo)題C2--></div> <!--js--> MyApp.controller("contr_1",["$scope","$rootScope",function($scope,$rootScope){$scope.c1_title="標(biāo)題C1";$rootScope.title="我是全局scope"; }]);MyApp.controller("contr_2",["$scope",function($scope){$scope.c2_title="標(biāo)題C2"; }]);

這里盡管 $rootScope contr_1 中定義其屬性,但在全局都能使用$rootScope定義的屬性;$rootScope有且只有一個,若有多個同名屬性或函數(shù),默認(rèn)取最后一個屬性或函數(shù)。

轉(zhuǎn)載于:https://www.cnblogs.com/MirageFox/p/7767566.html

總結(jié)

以上是生活随笔為你收集整理的angularjs探秘五 举足轻重的scope的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯,歡迎將生活随笔推薦給好友。