您的位置：首页 > Web前端 > JavaScript

AngulatJS多个控制器内数据共享

2015-06-27 17:29 531 查看

利用factory和service方法定义服务，通过两个控制器利用同一个服务达到控制器间数据共享的效果。

<!DOCTYPE html>
<html>

<head>
<meta charset="utf-8">
</head>

<body ng-app="app">
<div ng-controller="Controller1">
<input type="text" ng-model="value1.message">
<p>first:<span ng-bind="value1.message"></span></p>
</div>
<div ng-controller="Controller2">
<p>second:<span ng-bind="value2.message"></span></p>
</div>
<script src="http://cdn.bootcss.com/angular.js/1.4.0-rc.2/angular.min.js"></script>
<script type="text/javascript">
angular.module('app', [])
.factory('Data', function() {
return {
message: ''
};
})
.controller('Controller1', function($scope, Data) {
$scope.value1 = Data;
})
.controller('Controller2', function($scope, Data) {
$scope.value2 = Data;
});
</script>
</body>

</html>

这里使用的是factory方法，定义了名为Data的服务，这个服务就是连接两个controller的桥梁。

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航