CODEWITHSUNDEEP
htmlangularjsjson
Fred. Dutra
Fred. Dutra

Reputation: 31

Display data from Json in Angularjs

First of all, I have to say that is my first time posting on StackOverflow.. So if I post on the wrong area, sorry.

I'm beginning with angularjs, and I'm struggling into two points. 1st I've to create a connection with my mysql, witch i wasn't able until now.. 2nd I've to display the content into the HTML page.

I'm using the following code, witch includes the app.js, page.html and data.json (I'll change that later to php if I'm allowed to.) The app.js seems to work fine, but the view (page.html) isn't display any data..

App.js

    app.controller('PatientListCtrl', ['$scope', '$http', function ($scope, $http) {
    $http.get('patients.json').success(function (data) {
        $scope.patients = data;
    });
    $scope.orderProp = 'id';
}]);

patients.json

[
    {
        "id": 0, 
        "first_name": "John", 
        "last_name": "Abruzzi"
    }, 
     {
        "id": 1, 
        "first_name": "Peter", 
        "last_name": "Burk"
    }
]

Page.html

<!DOCTYPE html>
<html class="no-js" ng-app="app">

  <head>
    <meta charset="utf-8" />
    <title>AngularJS Plunker</title>
  </head>

  <body>

    <div data-ng-repeat="patient in patients">
        {{patient.id}}{{patient.last_name}}{{patient.first_name}}{{patient.SSN}}{{patient.DOB}}      
        <div>

    <script src="http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.20/angular.min.js"></script>
    <script src="app.js"></script>

  </body>

</html>

Thanks for your attention.

Upvotes: 1

Views: 2131

Answers (1)

Sajeetharan
Sajeetharan

Reputation: 222582

You have not define the controller in the view 

<div ng-controller="PatientListCtrl" data-ng-repeat="patient in patients">
       <li> {{patient.id}} </li>
  <div>

Here is the working Fiddle

Upvotes: 1

Related Questions