How to update the ng-repeat model of controller from another controller?

I have two <div> with their own controllers. The first div has a ng-model="listEntries". I initialize listEntries in this <div>'s controller.

app.controller('firstController', function($scope,serviceForFirst){
      serviceForFirst.init();
      serviceForFirst.getList($scope);
});

Html

<div ng-controller="firstController">
 <ul>
  <li ng-repeat="each in listEntries">
     {{each.name}}
  </li>
 <ul>
</div>

I pass the $scope to the getList() and set the $scope.listEntries value in serviceForFirst. I then use listEntries as ng-model.

app.service('serviceForFirst',function(){
 var list=[];
 var init=function(){
  list = [{....}];

 };

 var getList=function($scope){
  $scope.listEntries = list;

 };
 var update=function(newEntity){
   list.push(newEntity);
 };
return{
 init:init,
 getList:getList,
 update:update
};
});

This is my second controller and the service associated to it. I intend to push new elements into listAll every time I invoke addNew(). This is how I'm trying to do it.

app.controller('secondController', function($scope,serviceForSecond){
  serviceForSecond.init();
  $scope.addNew=function(newEntity){
         serviceForSecond.addNew(newEntity);
  };
});


app.service('serviceForSecond',function(serviceForFirst){
  var entities=[];
 var init=function(){
   entities=[{....}];
 };
 var addNew=function(newEntity){
    entities.push(newEntity);
    serviceForFirst.update(newEntity);
 return{
   init:init,
   addNew:addNew
 };
});

The HTML for this <div>

<div ng-controller="secondController">
  ....
  <input type="text" ng-model="newName"/>
  <button ng-click="addNew(newName)"/>
  ....
</div>

But the list is not getting updated in the first <div>. If I try to do $scope.$apply() in getList() before setting $scope.listEntries then I get $digest already in progress error.

When I do console.log(), I see that the appropriate function in each the services are getting invoked but the list is not being updated.

How should I update the list?

You just need one service, which holds the data you intend to share among the different controllers. Demo

template

<ul ng-controller='Ctrl1'>
    <li ng-repeat="item in items">
        {{item}}
    </li>
</ul>

<div ng-controller="Ctrl2">
    <input type="text" ng-model="newName"/>
    <button ng-click="addNew(newName)">Add</button>  
</div>

controllers and service

var app = angular.module('myApp', []);

app.controller('Ctrl1', function($scope, myListService){
    $scope.items = myListService.getList();
});

app.controller('Ctrl2', function($scope, myListService){
    $scope.addNew = myListService.add;
});

app.service('myListService',function(){
    var list=[];
    init();

    function init(){
        list = ['one', 'two', 'three'];
    };

    var getList=function(){
        return list;
    };

    var add=function(newEntity){
        list.push(newEntity);
    };

    return{
        getList: getList,
        add: add
    };
});