AnjularJS中$scope和$rootScope的區(qū)別小結
更新時間：2016年09月18日 10:40:31 投稿：daisy
這篇文章給大家整理了關于AnjularJS中$scope和$rootScope的區(qū)別，文中運用實例代碼介紹的很詳細，有需要的朋友們可以參考借鑒，下面來一起看看吧。
一句話總結：
$rootScope針對全局的作用域生效
$scope只針對當前的controller作用域生效
用下面的例子來證明上述的說法：
定義一個模塊名為myApp
var myApp = angular.module('myApp', []);
創(chuàng)建oneController和twoController這兩個controller
oneController傳入$scope和$rootScope
myApp.controller('oneController', ['$scope', '$rootScope', function ($scope, $rootScope) {
// 局部的變量，只有在oneController中才會顯示
$scope.one_language = 'Python';
// 全局的變量，都可以調用
$rootScope.language = 'Go';
}]);
twoController只傳入$scope
myApp.controller('twoController', ['$scope', function ($scope) {
// 局部的變量，只有在twoController中才會顯示
$scope.two_language = 'Java';
}]);
HTML標簽內容
<span ng-app="myApp">
<style>
div{margin-top: 15px;border: 2px solid rebeccapurple;width: 400px;}
</style>
<div>
<h3>我是全局變量language: {{ language}}</h3>
</div>
<div ng-controller="oneController">
<h3>我是one_language局部變量: {{ one_language}}</h3>
</div>
<div ng-controller="twoController">
<h1>twoController</h1>
<h3>我是two_language局部變量: {{ two_language }}</h3>
<h3>我是one_language局部變量: {{ one_language}}</h3>
<h3>我是全局變量language: {{ language }}</h3>
</div>
</span>
顯示的結果
總結
以上就是這篇文章的全部內容，請仔細看看上面的代碼，這有助于你理解。如果有疑問大家可以留言交流，謝謝大家對腳本之家的支持。
相關文章
詳解如何在Angular應用中發(fā)起HTTP?302 redirect
這篇文章主要介紹了如何在Angular應用中發(fā)起HTTP 302 redirect詳解，有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪2023-12-12
指令（Directives）是所有AngularJS應用最重要的部分。盡管AngularJS已經提供了非常豐富的指令，但還是經常需要創(chuàng)建應用特定的指令。這篇教程會為你講述如何自定義指令，以及介紹如何在實際項目中使用2016-03-03
indexedDB bootstrap angularjs之 MVC DOMO (應用示例)
這篇文章主要介紹了indexedDB bootstrap angularjs之 MVC DOMO (應用示例)的相關資料,需要的朋友可以參考下2016-06-06
Angular2開發(fā)環(huán)境搭建教程之VS Code
不久前WebStorm的頻繁卡死終于讓我受不鳥了,我決定換個輕量級的編輯器，嘗試了Emacs、Sublime text,最后選擇了vscode。下面這篇文章主要給大家介紹了關于Angular2開發(fā)環(huán)境搭建教程之VS Code的相關資料，需要的朋友可以參考下。2017-12-12
這篇文章主要介紹了Angular封裝搜索框組件操作,結合實例形式分析了基于Angular組件庫實現(xiàn)搜索功能的封裝操作相關實現(xiàn)步驟與注意事項,需要的朋友可以參考下2019-04-04
本篇文章主要介紹了AngulaJS路由 ui-router 傳參實例 ，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-04-04
本文主要介紹AngularJS 視圖，這里整理了相關知識，并附代碼示例和實現(xiàn)效果圖，有興趣的小伙伴可以參考下2016-08-08
AngularJS實現(xiàn)動態(tài)添加Option的方法
這篇文章主要介紹了AngularJS實現(xiàn)動態(tài)添加Option的方法,涉及AngularJS事件響應及頁面元素動態(tài)操作相關實現(xiàn)技巧,需要的朋友可以參考下2017-05-05
Angular.js ng-file-upload結合springMVC的使用教程
這篇文章主要給大家介紹了關于Angular.js文件上傳控件ng-file-upload結合springMVC的使用教程，文中通過示例代碼介紹的非常詳細，對大家具有一定的參考學習價值，需要的朋友們下面來一起看看吧。2017-07-07
本篇文章主要介紹了Angular之指令Directive系列詳解，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-03-03