.factory and .controller doesn't work together with data from my php backend

ionic-v1
1

Hey there,
i have big issues with my php backend. I want to load the mysql data trough my php Backend in a factory. But the output is blank. To first i know that the backend works, because if i make the $http.get request in the controller all works fine. Here is some code:

Part of my php Backend:

if($db_connection) {
        $utfQuery = "SET NAMES 'utf8'";
        mysqli_query($db_connection, $utfQuery);

        $query = "SELECT * FROM testDB";
        $result = mysqli_query($db_connection, $query);
        
        $data = array();

        while($row = $result->fetch_assoc()) {
            $data[] = $row;
        }

        echo json_encode($data);
    
    }

Part of my controller.js:

.controller('TestCtrl', function($scope, $ionicModal, $http, $ionicPopup, $ionicLoading, Tests) {
    $scope.tests = Tests.all();
    console.log($scope.tests);
})

Part of my service.js:

.factory('Tests', function($http) {
    var tests = [];

    return {
        all: function() {
            $http.get("http://www.******.com/getTestBackend.php")
            .success(function(response) {
                tests = response.data;
                return tests;
            })
            .error(function(response) {
                alert("Something happened");
            });
        }
    }
})

Part of my Html Code:

<ion-item class="item item-icon-left item-icon-right item-remove-animate" ng-repeat="item in tests track by $index" href="#/tab/tests/{{item.id}}">
                <i class="icon ion-social-{{item.os}}"></i>
                <h2>{{item.title}}</h2>
                <p>asked by {{item.user}} ({{item.date}})</p>
                <i class="icon ion-chevron-right icon-accessory"></i>
            </ion-item>

ADB Log output:

D/SystemWebChromeClient(10117): file:///android_asset/www/js/controllers.js: Line 5 : undefined
I/Web Console(10117): undefined:5

In case that i make the request trough the controller all works fine but i want to organise it as factory for a better code and more possibilitys. I think the Problem is that the factory only get the data as object instead of an array. How to solve a problem like that?

2

I went through this and had so much trouble, but actually got this working. Can you post the result of the php page? Or at least an example?

3 
[{"id":"25","title":"test 1","text":"Test","os":"windows","date":"0000-00-00","user":"JulesW"},{"id":"26","title":"test 1","text":"Test","os":"apple","date":"18.05.2015 - 19:37","user":"JulesW"},{"id":"27","title":"test","text":"","os":"android","date":"19.05.2015 - 12:09","user":"JulesW"},{"id":"28","title":"ngInit?","text":"","os":"apple","date":"19.05.2015 - 12:16","user":"JulesW"},{"id":"29","title":"ngInit?","text":"","os":"windows","date":"19.05.2015 - 12:17","user":"JulesW"}]

that’s the output from my Backend. At the moment there are 5 Inputs in the mysql table.

4 
        all: function() {
        $http.get("http://www.******.com/getTestBackend.php")
        .success(function(response) {
            tests = response.data;
            return tests;
        })

I think you’re did something wrong here. Try to put in tests only response.

tests = response;
return tests;

Tell me if I’m correct.

EDIT: however you should do console.log(JSON.stringify($scope.test));

5

No, i’ve already tried it.

6

Put the $http.get thing outside the all() function.

7

Even this returns only a blank view.

.factory('Tests', function($http) {
    var tests = [];
    
    $http.get("http://www.*****.com/getTestsBackend.php")
    .then(function(response) {
        tests = response;
    });

    return {
        all: function() {
            return tests;   
        }
    }
})

and all iterations of it. With response or response.data.
When I run the http.get in the controller it works with $scope.tests = response.data;

Edit:
the adb logcat with tests=response:

D/SystemWebChromeClient(17832): file:///android_asset/www/js/controllers.js: Line 5 : undefined
I/Web Console(17832): undefined:5

the adb logcat with tests=response.data is even undefined.

(I’ve used console.log(JSON.stringify($scope.test)):wink:

8 
.factory('Tests', function($http,$q) {

var self = this;

self.all = function(){

     var deferred = $q.defer();

     getData().success(function(response){
         deferred.resolve(response);
     }).error(function(error,status){
         deferred.reject(error);
         alert('Some Error' + status);
     });

    return deferred.promise;
}

return self;

function getData(){
   return $http.get("http://www.*****.com/getTestsBackend.php")
    }
})

This is the way I’ve structured my services, using a deferred object will stop and undefined results being returned. My have some spelling errors and not 100% on the http get function, I’m on my phone so can glaze over it tomorrow when I’m in front a computer.