列表不会在AngularJS中刷新

时间:2014-11-24 11:45:01

标签: angularjs google-app-engine google-cloud-endpoints

我尝试使用Google App Engine(云端点)和AngularJs来实现简单的crud。

我开发了我的后端,一切运作良好。我的问题是Angular。

我将服务称为保存或删除后,我的列表不会刷新。

我的代码控制器:

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);
}


}]);

这是我的服务:

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;

}]);

我的观点是:

<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>

1 个答案:

答案 0 :(得分:1)

即使你更新了后端的数据,AngularJS也没有意识到这一点。保存或删除后,您需要致电listEstado()

但是,如果您使用ndb作为数据存储区,请注意由于ndb的最终一致性行为,您的更新数据可能无法立即使用。