angular.js $scope.$apply wont work on ng-repeat

Question

This used to work for me all the time using $scope.$apply on $http requests, what am i missing on this one? I first got the "Digest cycle is already in progress" msg, than added the setTimeout() which got rid of that msg but still ng-repeat wont update with the data. This shouldn't be a problem, i am clearly missing something.

The HTML:

<form name="userDataForm" role="form" ng-submit="submit()">
<input type="text" name="userId" placeholder="Enter User ID" ng-model="viewModel.useId" />
<input type="text" name="start" placeholder="Start Date: dd-mm-yyyy" ng-model="viewModel.startDate"/>
<input type="text" name="end" placeholder="End Date: dd-mm-yyyy" ng-model="viewModel.endDate"/><br/>

<button type="submit">
    Get Data
</button>
<ul ng-repeat="place in viewModel.userData.data.significant_places">
    <li>
        You have been at <span style="color:red;">{{place.name}}</span> <span style="color:red;">{{place.number_of_days}}</span> days this month
    </li>
<ul>

The JS

$scope.viewModel = {
    userId:'',
    startDate:'',
    endDate:'',
    userData:{}
};
$scope.submit = function(){
                 setTimeout(function(){
                    $scope.$apply(function(){
                        $http.get('http://localhost:3000/?user_id=279&start=20150101&end=20150113').success(function(data){
                            $scope.viewModel.userData = data;
                        }).error(function(){
                            console.log('error');
                        });
                    });
                 }, 1)


};

You should add some info about your goal here. Instinctively, I don't think this is the easiest way to do it. — Casey, Jan 19 '15 at 18:04
Why on earth would you wrap your http call in a `$apply`? Also does your returned data contain `data: { significant_places: [ ...`? — a better oliver, Jan 19 '15 at 19:18

score 0 · Accepted Answer · answered Jan 19 '15 at 18:09

This should work just fine:

$scope.viewModel = {
    userId:'',
    startDate:'',
    endDate:'',
    userData:{}
};
$scope.submit = function(){

    $http.get('http://localhost:3000/?user_id=279&start=20150101&end=20150113').success(function(data){
        $scope.viewModel.userData = data;
    }).error(function(){
        console.log('error');
    });

};

There are very few instances when should need to use $scope.$apply yourself. Angular almost always does it for you (that's why you're getting that error).

Thanks, at the end it was a problem on my side, where i was searching a wrong json stractur. my bad. — Tomas Katz, Jan 22 '15 at 08:11

angular.js $scope.$apply wont work on ng-repeat

1 Answers1