Display json data with ng-controller and ng-repeat


Hello every one, I have a problem to display data that i get from a php page encoded with json.

Here’s the code of each page :

GetReservations.php :

    header("Access-Control-Allow-Origin: *");
    $user=json_decode(file_get_contents('php://input'));  // Accesseur sur le formulaire de connexion

    $req=myPDO::getInstance()->prepare("SELECT * 
                                        FROM wp_postmeta 
                                        WHERE post_id IN (SELECT post_id 
                                                          FROM wp_postmeta 
                                                          WHERE meta_value IN (SELECT ID 
                                                                               FROM wp_posts 
                                                                               WHERE post_type = 'product'
                                                                               AND post_author = :id
                                                                               AND post_status = 'publish'))");

    $reservations = array();
    $keys =  array('produitName','lieuSortie','dateSortie','position','invites','heureSortie');
            $reservations[] = $reservation;
        $data = json_encode($reservations);
        print $data;


my PHP page returns :


GetReservations function :

function GetReservations($scope, $http) {
    // this is where the JSON from api.php is consumed
        success(function(data) {
            // here the data from the api is assigned to a variable named user
            $scope.res = {};
            $scope.res.posts = data;

And the reservations.html page :

<div style="margin-top:60px;height:auto;" ng-controller="GetReservations">
              <div class="list card" ng-repeat="item in res.posts">
                  <div class="item item-avatar">
                    <img src="img/avatar.png">
                    <h2>Nouvelle réservation !</h2>
                    <p>{{item.invites}} personnes</p>

                  <div style="background-image:url(img/cover.png);padding-top:34px;padding-bottom: 34px; color: white;/*font-size: 2em;*/right: 0;left:0;text-align:center;">
                    <div class="infos-res">
                      <i class="icon ion-calendar"> </i> {{item.dateSortie}}
                      <i class="icon ion-clock"> </i> {{item.heureSortie}}


                    <div class="button-bar">
                      <button class="button button-balanced" ng-click="accepter()">Accepter</button>
                      <button class="button button-assertive" ng-click="confirmRefus()">Refuser</button>


The problem is that I get nothing showed on my page


Is the data returned from your PHP page a String or an Object?

console.log(typeof data);

If it is a string try:

$scope.res.posts = angular.fromJson(data);