Question

我试图弄清楚这是最好的方法。我试图将数据插入到WebSQL表中，然后从表中选择数据并使用ng-repeat在屏幕上显示。我正在使用这个Angular WebSQL模块https://github.com/paulocaldeira17/angular-websql#select-all。到目前为止，我可以获取远程数据并将其插入本地数据库。当我尝试调用插入数据时，$ scope.localproducts显示一个空数组 - console.log（$ scope.localproducts）显示一个空数组。我使用本地产品范围进行ng-repeat。

我无法从Factory的selectAllData函数将ProductsFactory.localproducts数组返回给我的控制器。

单击页面上的按钮时，它会调用Controller中的insertData函数。

我在这里做错了什么？我对角度很新，所以如果有人能帮助我改进下面的代码或建议是否有更好的方法，我会非常感激。

.controller('DownloadProductsCtrl', ['$scope','ProductsFactory', function ($scope, ProductsFactory){
    $scope.products = ProductsFactory.products;
    $scope.localproducts = ProductsFactory.localproducts;

    $scope.insertData = function(){
        ProductsFactory.getRemoteData().then(function(results){
            $scope.localproducts = ProductsFactory.localproducts;
            console.log( $scope.localproducts); //This shows an empty array
        });
    }; }])

.factory('ProductsFactory', ['$webSql', function($webSql){
    db = $webSql.openDatabase('myappdb', '1.0', 'Test DB', 2 * 1024 * 1024);
    ProductsFactory = {};
    ProductsFactory.products = [];
    ProductsFactory.localproducts = [];

    ProductsFactory.getRemoteData = function () {
        return $http.get('./products/list.json')
        .success(function (data) {
            ProductsFactory.products = data;
            ProductsFactory.insertData(data);
        })
        .error(function () {
            console.error('Error');
        });
    };

    ProductsFactory.insertData = function (data){
        angular.forEach(data, function(value, key) {
            db.insert('products', value).then(function(results) {
                <!-- In here I like to count the total inserted items and display it on the page, but not sure sure how to send it to a scope in my controller -->
            });     
        });
        ProductsFactory.selectAllData();
    };

    ProductsFactory.selectAllData = function(){

        db.selectAll("products").then(function(results) {
          for(var i=0; i < results.rows.length; i++){
             ProductsFactory.localproducts.push(results.rows.item(i)); //This added data to the array successfully.
          }
          console.log(ProductsFactory.localproducts); //This shows an empty array
        });
    };

    return ProductsFactory;

}]);

Answer 1

尝试使用此资源作为起点。

https://gist.github.com/jgoux/10738978

https://github.com/paulocaldeira17/angular-websql/blob/master/angular-websql.js

第一个是非常基本的，更容易理解。第二个更多参与。

使用Angular JS选择websql Data

1 个答案: