AngularJS实现controller控制器间共享数据的方法示例

时间:2021-05-28

本文实例讲述了AngularJS实现controller控制器间共享数据的方法。分享给大家供大家参考,具体如下:

<!DOCTYPE html><html ng-app="myapp"><head><title>/bootstrap/3.0.3/css/bootstrap.min.css" 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>

运行效果:

更多关于AngularJS相关内容感兴趣的读者可查看本站专题:《AngularJS指令操作技巧总结》、《AngularJS入门与进阶教程》及《AngularJS MVC架构总结》

希望本文所述对大家AngularJS程序设计有所帮助。

声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。

相关文章