how to sharing and update data between controller with service in angularjs

Question

Now I am trying sharing data between controllers with factory. what I want is whenever I update my input value in controlA the value in controlB will be updated. Would you please point out where is my problem?

var app = angular.module('app', []);
app.factory('share', function() {
    return {
        user: {}
    };
})
.controller('MainCtrl', function($scope, share) {
    $scope.user = {
        name: 'lin'
    };
    share.user.name = $scope.user.name;
    console.log(share.user.name);
})
.controller('linctr', function($scope, share) {
    $scope.super = {
        name: share.user.name
    };
});

Html:

<div ng-controller="MainCtrl">
    <input ng-model="user.name" />    
</div>
<div ng-controller='linctr'>
    <div>{{super.name}}</div>
</div>

dfsq · Accepted Answer · 2014-12-17 21:07:26Z

1

In the second controller use:

.controller('linctr', function($scope, share) {
    $scope.super = share.user;            
});

In this case $scope.super points to the same object as share.user. Otherwise when you do

$scope.super = { 
    name: share.user.name
};

super has no connection to share.user object, it just assigns primitive value of the its property name.

answered Dec 17, 2014 at 21:07

dfsq

193k26 gold badges244 silver badges261 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

linyuanxie Over a year ago

I just added $watch in controllerA,then it works!$scope.$watch('user.name',function(newv,oldv){ share.user.name=newv; console.log(share.user.name); }); })

dfsq Over a year ago

Yes, I just wanted to advise $watch. Or another approach is to use share.user = $scope.user; in the first controller. plnkr.co/edit/S2vdNVFOT6BkFSEJuLQK?p=preview

linyuanxie Over a year ago

But you are right, I should point to object instead of property.Thank you for pointing out.

dfsq Over a year ago

It's better to avoid additional watchers for performance sake. So if you can use object references it's more natural for javascript, as it works very fast.

linyuanxie Over a year ago

I see it, Thank you very much for helping me out. it is real helpful!

Collectives™ on Stack Overflow

how to sharing and update data between controller with service in angularjs

1 Answer 1

5 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related