Выберите данные websql с помощью Angular JS

Я пытаюсь найти лучший способ сделать это. Я пытаюсь вставить данные в таблицу WebSQL, а затем выбрать данные из таблицы и отобразить на экране с помощью ng-repeat. Я использую этот модуль Angular WebSQL https://github.com/paulocaldeira17/angular-websql#select-all. Пока я могу получить удаленные данные и вставить их в локальную базу данных. Когда я пытаюсь вызвать данные вставки, $ scope.localproducts показывает пустой массив - console.log ($ scope.localproducts) показывает пустой массив. Я использую область localproducts для моего ng-repeat.

Я не могу вернуть массив ProductsFactory.localproducts моему контроллеру из функции Factory selectAllData.

Когда нажимает кнопку на моей странице, он вызывает функцию insertData в моем контроллере.

Что я здесь сделал не так? Я новичок в angular, поэтому был бы очень признателен, если бы кто-нибудь помог мне улучшить приведенный ниже код или предложил, есть ли лучший способ сделать это.

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

}]);