日韩性视频-久久久蜜桃-www中文字幕-在线中文字幕av-亚洲欧美一区二区三区四区-撸久久-香蕉视频一区-久久无码精品丰满人妻-国产高潮av-激情福利社-日韩av网址大全-国产精品久久999-日本五十路在线-性欧美在线-久久99精品波多结衣一区-男女午夜免费视频-黑人极品ⅴideos精品欧美棵-人人妻人人澡人人爽精品欧美一区-日韩一区在线看-欧美a级在线免费观看

歡迎訪問 生活随笔!

生活随笔

當前位置: 首頁 > 编程资源 > 编程问答 >内容正文

编程问答

angularjs探秘五 举足轻重的scope

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

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

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

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

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

scope在定義controller時首先被注入,然后作為參數被引用,controller中的所有屬性和函數皆以scope為對象聲明的屬性和函數,在view(HTML)中使用controller的屬性及函數都不需要加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="標題C1"; }]);

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

scope的作用范圍

先看個例子:

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

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

轉載于:https://www.cnblogs.com/MirageFox/p/7767566.html

總結

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

如果覺得生活随笔網站內容還不錯,歡迎將生活随笔推薦給好友。