MySQLi - database request


Hey guys,

I’m searching for an current tutorial to do a mysqli database request.

I build a tab called “groups” and want to load some JSON-string from the “load_Groups.php”.

Here the code of my controller.js

angular.module('starter.controllers', [])

.controller('DashCtrl', function($scope) {})

.controller('ChatsCtrl', function($scope, Chats) {
  $scope.chats = Chats.all();
  $scope.remove = function(chat) {

.controller('ChatDetailCtrl', function($scope, $stateParams, Chats) {
  $ = Chats.get($stateParams.chatId);

.controller('GroupsCtrl', function($scope) {
 loadGroups(); // Load all available tasks
 function loadGroups(){
  $scope.Groups = data;

.controller('AccountCtrl', function($scope) {
  $scope.settings = {
    enableFriends: true

The structure is like that:


And now the code of the load_Groups.php

include_once 'db_connect.php';
include_once 'functions.php';

$user_ID = 1;

$suche = $user_ID;
if($stmt = $mysqli->prepare(
            ")) {
  $stmt->bind_param("s",  $suche);

  while($stmt->fetch())   {
  $grps[] = array(
echo json_encode(array('groups' => $grps))

With that code, i just got the error:
“Error: Can’t find variable: $http

Anyone an idea why this happens?


You have to inject $http in your GroupsController, and maybe timeout if you dont see the results in the view:

.controller('GroupsCtrl', function($scope, $http, $timeout) {
            $scope.Groups = data;


works fine.
but now i see the whole code of the “load_Groups.php” in the console and not just the ECHO.
I don’t need to stringify the data, because i return an JSON-array.

This is the end of the “load_Groups.php”:

And it returns me the whole code/content of the PHP-file.
But when i just open die PHP-file in browser, i see the correct output… :confused:


Im not a php-guy, but maybe set the content-type of the .php to “application/json”


found here:


You are requesting a local PHP file.
PHP must be run on a web server, IonicFramework runs using Javascript, PHP won’t be installed.

What you need to do is to run a apache2 server. This can not be done on the phone, it must be hosted elsewhere. You can then query that server for the data.


It looks like I’m requesting a local file, but Ionic is installed on a virtual server.
I use Ionic on my MacBook via MAMP.
The path in safari-adressbar is like that:


Sure you may have MAMP installed, but for it run through the server, you have to call it under port 80, not 8100.




and it should work.


Now i have change it to port 80 and change the relativ link to a constant (but it also must work without, right?):

now this error occurs:
XMLHttpRequest cannot load http://localhost/testapp/www//php/load_thigs.php. Origin http://localhost:8100 is not allowed by Access-Control-Allow-Origin.

This i an CORS issue just with “ionic serve/run”. Here a link:

It works fine with an constant link, but why not with an relativ?


The reason it requires a absolute url is because if you call a PHP file via a relative url, it is not being called through the server, The computer doesn’t know how to use it. Therefore, it runs as though it was a text file.


And how do i that with an factory? is it the same way?


You will need the PHP to be hosted on a server with PHP and MySQL installed.
Only then will you be able to request it.

Say your PHP is hosted on
If you call that it will work.
Although say this URL is hosted locally, you could access it with http://localhost/example/.
This is the only way that PHP will run.

Calling it via /var/www/example/ will request the PHP file but will not run through apache2 or nginx (depending on the software used to run the webserver), therefore not executing the code and resulting in plain text displaying.

Although, when hosting it on http://localhost/example, Only your computer will be able to access this, (this is fine for browser based testing, but when you move to testing on a device, you will either need to host it on a webserver or use your IP.