I'm developing a mobile application using Ionic Framework based an AngularJS.
On one directive I'm looping over a JSON Array with ng-repeat
applying a condition with ng-if
, see below:
<ion-content class="has-header has-subheader" >
<ion-slide-box">
<ion-slide
ng-if="invocation.title_id == titleid"
ng-repeat="invocation in invocations" >
<h3>{{invocation.id}}</h3>
<div ><h1>{{invocation.invocation_frensh }}</h1></div>
<div ><h1>{{invocation.invocation_ar}}</h1></div>
<div ><h1>{{invocation.invocation_franko}}</h1></div>
<div ><h1>{{invocation.comments_fr}}</h1></div>
<div ><h1>{{invocation.comments_ar}}</h1></div>
</content>
</ion-slide>
</ion-slide-box>
<p>{{invocation.id}}</p>
</ion-content>
The point is that on the last p
nothing is shown.
I understand that the $scope is not the same but on the last "p"
or any other component outside the ng-repeat
I need to have the same data in order to interact with it.
For exemple I want to add a button on a footer that gets the "{{invocation.id}}"
. If invocation.id equals 3 inside the ng-repeat "h3"
I want to have it equals 3 in the "p"
How can i do it ?
Thanks for you help
Edit: In fact I want invocations[index].id in the 'p' outside of the loop, where index equals the displayed slide.
the invocation
variable dies when the ng-repeat
ends, if you need to use it again, you will need another ng-repeat
Assuming that you want to show only one slide at a time, you could do it without ng-if
, and use filter instead.
<ion-slide ng-repeat="invocation in displayedInvocations = (invocations | filter:{title_id: title_id}:true)">
and then at outside:
<p>{{displayedInvocations[0].id}}</p>
Hope this helps.