AngularJS實現(xiàn)controller控制器間共享數(shù)據(jù)的方法示例
本文實例講述了AngularJS實現(xiàn)controller控制器間共享數(shù)據(jù)的方法。分享給大家供大家參考,具體如下:
<!DOCTYPE html> <html ng-app="myapp"> <head> <title>www.dbjr.com.cn 控制器間共享數(shù)據(jù)</title> <link rel="stylesheet" rel="external nofollow" > <style> body { padding-top:30px; } </style> <script src="angular.min.js"></script> <script> angular.module('myapp', []) .factory("Data", function() { return { msg:"hello world" }; }) .controller("CtrlF", function($scope, Data) { $scope.data = Data; }) .controller("CtrlS", function($scope, Data) { $scope.data = Data; }); </script> </head> <body> <div class="container"> <div class="col-sm-8 col-sm-offset-2"> <div ng-controller="CtrlF"> <input type="text" ng-model="data.msg"> <h1>{{data.msg}}</h1> </div> <div ng-controller="CtrlS"> <input type="text" ng-model="data.msg"> <h1>{{data.msg}}</h1> </div> </div><!-- col-sm-8 --> </div><!-- /container --> </body> </html>
運行效果:
更多關(guān)于AngularJS相關(guān)內(nèi)容感興趣的讀者可查看本站專題:《AngularJS指令操作技巧總結(jié)》、《AngularJS入門與進(jìn)階教程》及《AngularJS MVC架構(gòu)總結(jié)》
希望本文所述對大家AngularJS程序設(shè)計有所幫助。
- AngularJS控制器controller正確的通信的方法
- AngularJs學(xué)習(xí)第五篇從Controller控制器談?wù)?scope作用域
- AngularJS控制器controller給模型數(shù)據(jù)賦初始值的方法
- 詳解Angularjs在控制器(controller.js)中使用過濾器($filter)格式化日期/時間實例
- AngularJS 控制器 controller的詳解
- AngularJS利用Controller完成URL跳轉(zhuǎn)
- Angularjs中controller的三種寫法分享
- angularJS+requireJS實現(xiàn)controller及directive的按需加載示例
- Angularjs的Controller間通信機(jī)制實例分析
相關(guān)文章
AngularJS 監(jiān)聽變量變化的實現(xiàn)方法
今天小編就為大家分享一篇AngularJS 監(jiān)聽變量變化的實現(xiàn)方法,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2018-10-10Angular 輸入框?qū)崿F(xiàn)自定義驗證功能
AngularJS 表單和控件可以驗證輸入的數(shù)據(jù)。本文給大家介紹Angular 輸入框?qū)崿F(xiàn)自定義驗證功能,非常不錯,具有參考借鑒價值,需要的朋友參考下2017-02-02AngularJS出現(xiàn)$http異步后臺無法獲取請求參數(shù)問題的解決方法
這篇文章主要介紹了AngularJS出現(xiàn)$http異步后臺無法獲取請求參數(shù)問題的解決方法,較為詳細(xì)的分析了AngularJS出現(xiàn)異步請求后臺無法解析的原因與相應(yīng)的解決方法,需要的朋友可以參考下2016-11-11AngularJS使用指令增強(qiáng)標(biāo)準(zhǔn)表單元素功能
這篇文章主要介紹了AngularJS使用指令增強(qiáng)標(biāo)準(zhǔn)表單元素功能,包括數(shù)據(jù)綁定、建立模型屬性、驗證表單等,感興趣的小伙伴們可以參考一下2016-07-07AngularJS模仿Form表單提交的實現(xiàn)代碼
本文通過一段實例代碼給大家簡單介紹了angularjs模仿form表單提交的方法,非常不錯,具有參考借鑒價值,感興趣的朋友一起看看吧2016-12-12Angular中$cacheFactory的作用和用法實例詳解
$cacheFactory是一個為Angular服務(wù)生產(chǎn)緩存對象的服務(wù)。接下來通過本文給大家介紹Angular中$cacheFactory的作用和用法實例詳解,非常不錯,感興趣的朋友一起看下吧2016-08-08Angular4.x Event (DOM事件和自定義事件詳解)
今天小編就為大家分享一篇Angular4.x Event (DOM事件和自定義事件詳解),具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2018-10-10Angular.js 實現(xiàn)數(shù)字轉(zhuǎn)換漢字實例代碼
這篇文章主要介紹了Angular.js 實現(xiàn)數(shù)字轉(zhuǎn)換漢字實例代碼的相關(guān)資料,非常不錯,具有參考借鑒價值,需要的朋友可以參考下2016-07-07