Angularjs $scope is not updating

Question

In my application, from one controller i am updating $scope.needs.Then when i click a button, it is going to another controller. There i am getting the updated value of $scope.needs. But when click on back button, it is going to the previous controller. There i am not getting the updated value of $scope.needs. How to solve this issue.

This is the first controller.

function CommitmentCtrl($scope, $routeParams, $http, UIData, cust, productList) {
  $scope.needs = $scope.customer.priorities.list;
}

In this controller

$scope.increment = function(index) {
    $scope.needs[index].commitment = parseFloat   ($('#custom_commitment_'+index).val()) + 1000;

    }

Here $scope.needs updated..rite? Then when click on button,the below function is called

$scope.gotoSummary = function(){
  $scope.customer.priorities.list = $scope.needs;
}

Here $scope.customer.priorities.list contains the updated value.

This is the next controller

function SummaryCtrl($scope, $routeParams, $http, UIData, cust) {
  $scope.$parent.needs = $scope.customer.priorities.list;
}

Then click on back button invokes the first controller,but there in $scope,updated value is not there.

How do I update $scope.needs in both places?

could you please share fiddle

Ajay Singh Beniwal
– Ajay Singh Beniwal

2013-04-07 07:12:38 +00:00
Commented Apr 7, 2013 at 7:12 — Ajay Singh Beniwal
– Ajay Singh Beniwal, Commented Apr 7, 2013 at 7:12

Ajay Singh Beniwal · Accepted Answer · 2013-04-07 07:56:28Z

There are two ways to acheive this 1)Using $rootScope 2)Using Angular Service

1)Using $rootScope

<html ng-app="jsf">
<head>
    <title></title>

    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.5/angular.min.js"></script>
</head>
<body>
    <div ng-controller="CategoriesCtrl">
        <input type="button" value="update" ng-click="update()" />
    </div>
      <div ng-controller="secondCtrl">
        <input type="button" value="check" ng-click="check()" />
    </div>
    <script>
        var app = angular.module('jsf', []);


        app.controller('CategoriesCtrl', function ($scope, $rootScope) {
            $rootScope.block = [3, 2, 1, 0];
            $scope.update = function () {
                alert("123");
                $rootScope.block[1] = '5';
            }
        });

        app.controller('secondCtrl', function ($scope, $rootScope) {
            $scope.check = function () {
                alert($rootScope.block[1]);
            }
        });
    </script>
</body>
</html>

2)You have to create a angular service and maintain the value inside service and share the value across controllers

service should be suggestion #1. $rootScope shouldn't be used to store data

Collectives™ on Stack Overflow

Angularjs $scope is not updating

1 Answer 1

1 Comment

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Related