How to Display Data Inside Nested ng-repeat Directives

I have two objects, programme and section, each programme has some sections I have two services, the first service shows all programmes, and the second service shows all sections for one programme, the problem is : I can't show each sections for one programme using the code of programme as a parameter, this is my code :

var app=angular.module("myApp",[]);
app.controller("myController",function($scope,$http){

    $scope.programme=null;
    $scope.section=null;

   $http.get("/programmes").success(function(response) {
        $scope.programme = response;
    });


    //getting sections for one programme using code
   $scope.getSectionByCode = function(code)
    {   
       $http.get("/listsections/"+code).success(function(data){

          $scope.section = data;
       });
    }; 

});

HTML

<div class="padd" ng-app="myApp" 
                  ng-controller="myController">
      <ul>
        <li ng-repeat="x in programme" 
            ng-init="getSectionByProgCode(x.code)" >
                {{x.titre}}
            <ul>
              <li ng-repeat="s in section">{{s.title }}</li>
            </ul>
        </li> 
      </ul>
    </div>

the result of this code is :

programme 1
      Section title 4
      Section title 5
programme 2
      Section title 4
      Section title 5

but im looking for this result :

programme 1
      Section title 1
      Section title 2
      Section title 3
programme 2
      Section title 4
      Section title 5

Note : when I check my browser log, I find that the service of section get the results properly for each programme.