Ionic app retrieving data from sql database

Question

Im building an Ionic app to interact with a mysql server. Im trying to retrieve data from sql database on localhost by requesting a php file which retrieves the data and outputs it in json format in web browser, in my app the http get() executes without error but it does not display anything on the app. Here is my app.js:

project.controller("myController", function($scope, $http) {
$scope.getData = function() {
    $http.get("http://localhost/server.php")
      .success(function(data) {

        $scope.id = data.Id;
        $scope.name = data.Name;
        $scope.model = data.Model;
        $scope.caryear = data.CarYear;
        $scope.esize = data.EngineSize;
        $scope.etype = data.EngineType;
        $scope.fuel = data.FuelType;
        $scope.doors = data.Doors;
        $scope.price = data.Price;
    })
      .error(function(data) {
        alert("something is wrong");
    })
  }

});

And index.html:

<script type="text/ng-template" id="car2.html">
    <ion-view view-title="Car 2"> 
        <ion-content ng-controller="myController" ng-init="getData()">
            <div>
                <h2>Car 2</h2>
                <br>
                ID: {{id}}
                <br>
                Name: {{name}} {{model}}
                <br>
                Car Year: {{caryear}}
                <br>
                Engine Size: {{esize}}
                <br>
                Engine Type: {{etype}}
                <br>
                Fuel: {{fuel}}
                <br>
                Doors: {{doors}}
                <br>
                Price: {{price}}
            </div>
        </ion-content>
    </ion-view>
</script>

Output of php file:

[{"Id":"1","Name":"BMW","Model":"M5","CarYear":"2005","EngineSize":"5.0","EngineType":"V10","FuelType":"Petrol","Doors":"4","Price":"25000.00"}]

I had errors with Access Allow Origin but I added required headers to my php file and those are solved. Any suggestions why the data is not displayed in the app , thanks in advance.

Community · Accepted Answer · 2017-05-23 12:23:25Z

1

Do follow dot rule while defining model in angular scope

$scope.model = {};

And all properties to $scop.model lik

$scope.model = data; //is sufficient

Detailed answer here

edited May 23, 2017 at 12:23

CommunityBot

11 silver badge

answered Feb 29, 2016 at 19:02

Pankaj Parkar

136k23 gold badges241 silver badges307 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

edvalas Over a year ago

I changed all the properties and it works but all my {{id}}... tags in html now show to whole json object, am I supposed to parse/break it up or how do i reference each part like id , name?

Pankaj Parkar Over a year ago

Do {{model.id}} and {{model.name}} instead.

edvalas Over a year ago

Cant believe im stuck on something so simple, I cannot get my head around this notation and dont fully understand what you mean by $scope.model = {}; I've looked at the detailed answer and its too detailed

Pankaj Parkar Over a year ago

What you don't understand?

Collectives™ on Stack Overflow

Ionic app retrieving data from sql database

1 Answer 1

4 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Linked

Related