多个控制器内数据共享

来源：互联网发布：java设置编码格式编辑：程序博客网时间：2024/05/16 05:14

通过$$prevSibling方法实现共享：

JS页面：

angular.module('myApp',[])

.controller('firstController', function($scope){

        $scope.date = {

           name: "Tom"};

        console.log($scope);

})

.controller('secondController', function($scope){

        $scope.date = $scope.$$prevSibling.date;

})

html页面：

<body>

    <div ng-app="myApp">

        <div ng-controller="firstController">

            <input type="text" ng-model="date.name" />

<p>

                first:{{date.name}}

            </p>

            

        </div>

        <div ng-controller="secondController">

<p>

                second:{{date.name}}

            </p>

        </div>

    </div>

<script type="text/javascript" src="../../vendor/angular/angularjs.js"></script>

<script type="text/javascript" src="app/index.js"></script>

</body>

通过factory或者service方法实现共享：

JS页面：

angular.module('myApp',[])
.factory('factoryName',function(){
return{
message:'this is the message we shared'
}
.controller('firstController',function($scope,factoryName){//这里根据angular的自动注入把factory的名字加进去
$scope.date= {
name:"Tom"};
console.log($scope);
$scope.factoryName= factoryName;
.controller('secondController',function($scope,factoryName){
$scope.date= $scope.$$prevSibling.date;
$scope.factoryName= factoryName;
console.log($scope);
})
})
})

html页面：

<body>    <div ng-app="myApp">        <div ng-controller="firstController">            <input type="text" ng-model="date.name" />            <input type="text" ng-model="factoryName.message" />            <p>                first:{{date.name}}            </p>            <p>                firstMessage:{{factoryName.message}}            </p>        </div>        <div ng-controller="secondController">            <p>                second:{{date.name}}            </p>            <p>                secondMessage:{{factoryName.message}}            </p>        </div>    </div><script type="text/javascript" src="../../vendor/angular/angularjs.js"></script><script type="text/javascript" src="app/index.js"></script></body>

0 0