ste ste - 1 year ago 132
Ajax Question

AngularJS ng-repeat does not update after Ajax call

I have an AngularJS applcation.
On the right side of the application I keep the chat with my clients.

The html is the following:

<div class="recent" ng-show="show_chat_list">
<div ng-repeat="customer in recent_customer_list track by $index" ng-click="start_chat(recent_client_id[$index])" class='user'>
<a href="#" ng-class="{'red-background': notify[$index]}">
<img ng-src="">
<div class="user-data">
<span class='name'> {{ notify }} </span>
<span class='name'>{{ }}</span>

I updated the list through a factory that do polling every second for new unformation:

factory('Poller', ["$http", "store", "URL", function($http, store, URL){

var data = {
"hairdresser_id": store.get("userId")

var poller = function(){
return $ + 'check_for_notifications', data).then(function(res){

return {
poll: poller

In the controller:


function pollData(){
$scope.recent_customers_list = res.customers;
$scope.recent_client_id = res.clients_id;
$scope.notify = res.notify;
$timeout(pollData, 1000);

The console.log function print always the correct name (even if I change it) but in the html does not reflect dynamic change of the list of clients (if I change names or add a client for example).

If I insert




right before the $timeout line I get the error:

Error: [$rootScope:inprog] $digest already in progress

insted if I insert apply right after the line functino pollData() and before the line Poller.poll() I get this error:

Error: [$rootScope:inprog] $apply already in progress

But my list is not updated at all. I need to refresh to see the changes.
How can I solve this?

Answer Source

In your controller, you are using


but in your html, you are using


I believe this is a simple typo.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download