Ionic custom directive controller


#1

I was wondering that if i can pass an array of objects to $scope of directive and when it occurs it shows different objects in array depending on there index in the array

eg

this is my directive template

    <div id="myAdvert" style ="display: block">
      <a class="item item-thumbnail-left" >
       <img src="{{customer.image}}">
       <h2>{{customer.name}}</h2>
       <p>{{customer.address}}</p>
     </a>
  </div>`

This is my directive

  angular.module('starter.Directives', [])
 .directive('browseto', [function() {
   return {
  restrict: 'AEC',
  templateUrl: "templates/myadvert.html",
  replace: true,
   scope: {
     customer: '=info'
    }
    }
}]);

and in my controller if i pass the object array doesnt seem to work what i want is if the object array is passed then whenever the directive is shown its data should be the next object in array

i will post all the requirement so that i can make some sense :slight_smile:

What i currently have is a list of users and i want to show an ad after every 10(x) user is shown so i am using ng-repeat to loop the users and i am putting this directive inside that ng-repeat block and showing it after every 10(x) user using ngif

Now if i assign a single object to the $scope.customer in the controller of the view then the ad is same through out the view , what i want is that when the next directive shows up in the view it should contain a different ad thats why i wanted to assign an array of objects to the directive so after every 10(X) user there will be a different ad but it doesnt seem to work so how can i go ahead and achieve this

Thanks


#2

Hi
@mhartington Can you help me with this

Thanks


#3

Hey there, could you provide an example to test against?


#4

The view template where i am using this template

        <ion-view> 
       <ion-refresher
            pulling-text="Pull to refresh..."
            on-refresh="doRefresh()">
        </ion-refresher>
            <ion-list>            
         <ion-item class="item-remove-animate item-avatar item-icon-right" ng-repeat="chat in chats"                        type="item-text-wrap" href="#/tab/{{chat.id}}">
    <img ng-src="http://ionicframework.com/img/docs/mcfly.jpg">
    <h2>{{chat.name}}</h2>
    <p>{{chat.lastText}}</p>
    <i class="icon ion-chevron-right icon-accessory"></i>
    <ion-option-button class="button-positive" ng-click="remove(chat)">
     Hide
    </ion-option-button>
    <ngif ="$index%5==0" browseto info="customer"> </browseto>
  </ion-item>

       </ion-list>
      <ion-infinite-scroll
     on-infinite="loadMore()"
  distance="1%">
        </ion-infinite-scroll>
        </ion-scroll>
   </ion-view> 

controller is

          .controller('ChatsCtrl', function($scope, Chats) {

      $scope.chats = Chats.all();
      $scope.customer = Chats.all();
     $scope.remove = function(chat) {
      Chats.remove(chat);
       };
       })