在AngularJs中从数据库中获取并显示数据

Stack two 发表于 Dev

叠二

我如何在屏幕上弹出客户列表，该列表来自我的数据库，我有11行客户，我想创建一个客户列表并显示它们，这是我的代码：

dbFactory.method = function findAll() {
    db.transaction(
        function(tx) {
            var sql = "SELECT (nome) as nomes FROM clientes";
            log(sql);
            tx.executeSql(sql, [],
                function(tx, results) {
                    var len = results.rows.length,
                        clientes = [],
                        i = 0;
                    for (; i < len; i = i + 1) {
                        clientes[i] = results.rows.item(i).nomes;
                    }
                    log(clientes + '  found');


                }
            );
        },txErrorHandler,
        function () {

        }
    );

};

控制器：

 .controller('ListaCtrl', function ($scope, dbFactory) {


         $scope.items = dbFactory.method();
         console.log(dbFactory.method());


    });

client.html：

<ion-view view-title="Playlists" ng-app="starter">
  <ion-content>
    <ion-list>
  <ion-item ng-repeat="itens in items" >

      <p>{{itens.nome}}</p>

  </ion-item>
    </ion-list>
  </ion-content>
</ion-view>

日志：

 Promise {$$state: Object, then: function, catch: function, finally: function}
$$state: Object
status: 1
value: SQLResultSet
insertId: [Exception: DOMException: Failed to read the 'insertId' property from 'SQLResultSet': The query didn't result in any rows being added.]
rows: SQLResultSetRowList
length: 11
__proto__: SQLResultSetRowList
rowsAffected: 0

叠二

我已经设法使用延期和承诺来解决，这是我所做的：

var getMessages = function findAll() {
            db.transaction(
                function(tx) {
                    var sql = "SELECT (nome) as nomes FROM clientes";
                    tx.executeSql(sql, [],
                        function(tx, results) {
                            var len = results.rows.length,
                                clientes = [],
                                i = 0;
                            for (; i < len; i = i + 1) {
                                clientes[i] = results.rows.item(i).nomes;
                            }
                            log(clientes + ' rowsss found');
                            deferred.resolve(clientes);

                        }
                    );
                },txErrorHandler,
                function () { }
            );
            return deferred.promise;

        };

        return {
            showClientes: getMessages
        };

控制器：

.controller('ListaCtrl', function ($scope, dbFactory) {

        dbFactory.showClientes().then(function(listview) {
            $scope.clientes = listview;
            console.log($scope.clientes);
        });

    });

和html：

<ion-view view-title="Playlists" ng-app="starter">
  <ion-content>
    <ion-list>
      <ion-item ng-repeat="cliente in clientes">

          {{cliente}}

      </ion-item>
    </ion-list>

  </ion-content>
</ion-view>

现在，我可以与所有客户一起查看列表视图。

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。