AngularJS - how to pass id to api from nested ng-repeat

Question

<div>       
        <ul ng-repeat="items in allcategories">
          <p class="padding">{{ items.title }}</p>
          <ion-slide-box show-pager="false" on-slide-changed="slideHasChanged($index)" class="padding">
            <ion-slide ng-repeat="ite in allvodsforcategory">
              <img ng-src="{{ ite.image }}">
            </ion-slide>
          </ion-slide-box>
        </ul>
      </div>

$http.get('http://api.com?user=' + $scope.apiusername + '&pass=' + $scope.apipassword + '&id=' . items.id).success(function(data) {
       $scope.allvodsforcategory = data.videos;
   });

$http.get('http://api.com?user=' + $scope.apiusername + '&pass=' + $scope.apipassword).success(function(data) {
        $scope.allcategories = data.categories;
    });

There is my code you can see the first ng-repeat on the ul item that is listing categories in side I want to list images no you can see the second ng-repeat on the ion-slide now I need to pass the items.id to the controller then put it into the url but I can not find a way to do that please help my all help is appreciated THANK YOU

Answer 1

If my understanding of your question is correct, I think that what you would have to do is create an isolate scope for your custom directive (ion-slide). This will allow you to pass the item id as an attribute. And it will be available to use in your controller. What I mean is:

    ...
        .directive(ionSlide, function(...) {
             return {
                 scope: {
                      itemId: '@',
                 },
                 .... // Other things
             };
        });

        // In your html you would then have
        ...
       <ion-slide item-id="{{item.id}}" ng-repeat="ite in allvodsforcategory">
                  <img ng-src="{{ ite.image }}">
                </ion-slide>
         ...

        // And in your controller,
        ...
        .controller(function($scope, ...){
            var id = $scope.itemId; // you have your id here.

            $http.get('http://api.com?user=' + $scope.apiusername + '&pass=' + $scope.apipassword + '&id=' id).success(function(data) {
       $scope.allvodsforcategory = data.videos;
     });
});

Hope this helps.