angularJS--多个控制器之间的数据共享

最新推荐文章于 2019-08-01 14:36:03 发布

拼搏的小叔

最新推荐文章于 2019-08-01 14:36:03 发布

阅读量445

点赞数

分类专栏： angular1.0系 js_studyShare 文章标签： angular服务 server angular angular实现多级控制器传值

本文链接：https://blog.csdn.net/js_admin/article/details/72170375

版权

js_studyShare 同时被 2 个专栏收录

36 篇文章 0 订阅

订阅专栏

angular1.0系

8 篇文章 0 订阅

订阅专栏

为了在控制器之间共享数据，需要在服务中添加一个用来储存用户名的方法。记住，服务在
应用的生命周期内是单例模式的，因此可以将用户名安全地储存在其中。

<!DOCTYPE html>
<html>
<head>
    <meta  charset="utf-8">
    <title>12-angularjs的多个控制器数据共享</title>
    <script src="../js/angularjs.js"></script>
    <script src="../js/index12.js"></script>

</head>
<body>
<!-- angularjs的数据绑定，双向绑定，M,V,c之间的绑定 -->


    <div ng-app="myApp">
        <div ng-controller= "firstController">
            <input type="text" ng-model="person.name" value="" />
                firstData--{{person.name}}
        </div>
        
        <div ng-controller="secondController">
            <input type="text"  value="" />
                secondData--{{person.name}}

        <div ng-controller= "firstController">
            <input type="text" ng-model="Data.message" value="" />
                firstData--{{Data.message}}
        </div>
        
        <div ng-controller="secondController">
            <input type="text"  value="" />
                secondData--{{Data.message}}
        </div>
        </div>
    </div>


</body>
</html>

下面是控制器的写法：

var myApp = angular.module('myApp', []);
 
myApp.factory('Data', function(){
    return {message:'Hello world1'};
 
});
 
myApp.controller('firstController',  function($scope,Data){
    $scope.person = {
        name: "Hello word2"
    };
 
    $scope.Data = Data;
});
 
myApp.controller('secondController',  function($scope,Data){
    $scope.person = $scope.$$prevSibling.person;//基本类型不能变的，只有对象才能引用
    $scope.Data = Data;
});

拼搏的小叔

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
angularJS--多个控制器之间的数据共享

为了在控制器之间共享数据，需要在服务中添加一个用来储存用户名的方法。记住，服务在应用的生命周期内是单例模式的，因此可以将用户名安全地储存在其中。 12-angularjs的多个控制器数据共享 firstData--{{person.name}}
复制链接

扫一扫