List does not refresh in AngularJS - angularjs

Question

I'm trying to implement a simple crud using Google App Engine (Cloud endpoints) and AngularJs.
I developed my backend and everything working well. My problem is Angular.
After I call my service to Save or Delete, my list doesn't refresh.
My code Controller:
app.controller('admEstadoController',['$scope','admEstadoService', function ($scope, admEstadoService) {
$scope.saveEstado = function() {
admEstadoService.saveEstado($scope);
}
$scope.deleteEstado = function(id) {
admEstadoService.deleteEstado(id,$scope);
}
$scope.listEstado = function() {
admEstadoService.listEstado($scope);
}
}]);
and this is my Service:
app.factory('admEstadoService',[function() {
var admEstadoService = {};
admEstadoService.listEstado = function($scope) {
gapi.client.enadepopapi.listEstado().execute(function(resp) {
$scope.estados = resp.items;
$scope.$apply();
});
}
admEstadoService.saveEstado = function($scope) {
estado = {
"estado" : $scope.estado,
"nome" : $scope.nome
};
gapi.client.enadepopapi.saveEstado(estado).execute();
}
admEstadoService.deleteEstado = function(id,$scope) {
estado = {
"estado" : id
};
gapi.client.enadepopapi.deleteEstado(estado).execute();
}
return admEstadoService;
}]);
And my view is:
<div class="panel panel-default" ng-show="is_backend_ready">
<div class="panel-heading">Manutenção de Estados</div>
<div class="panel-body">
<div class="row">
<div class="col-md-6 col-md-offset-3">
<form role="form">
<div class="form-group">
<label for="txtEstado">Estado</label>
<input type="text" class="form-control" id="txtEstado" placeholder="" ng-model="estado">
</div>
<div class="form-group">
<label for="txtNome">Nome</label>
<input type="text" class="form-control" id="txtNome" placeholder="" ng-model="nome">
</div>
<button type="submit" ng-click="saveEstado()" class="btn btn-default">Gravar</button>
</form>
<div class="bs-example-bg-classes" style="margin-top:10px;">
<p class="bg-success"> Registro Gravado com sucesso!</p>
</div>
<div class="clearfix"></div>
<div ng-init="listEstado()">
<table class="table table-hover">
<tbody class="table-hover">
<tr>
<th>Estado</th>
<th>Nome</th>
<th>Operação</th>
</tr>
<tr ng-repeat="estado in estados">
<td>{{estado.estado}}</td>
<td>{{estado.nome}}</td>
<td><button type="button" ng-click="deleteEstado(estado.estado)" class="btn btn-default">Excluir</button>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>

Answer 1

Even though you update the data in the backend, AngularJS is not aware of this. You need to call listEstado() after save or delete.
However, if you're using ndb as your datastore, be aware that your updated data may not be available instantly because of ndb's eventual consistency behavior.