Using ng-click inside np-repeat - Find respective index

[Yashwanth Maheshwaram]

I'm trying to implement a shortlisting functionality in a case where I'm using ng-click inside ng-repeat.

While the $index is being displayed correctly outside the ng-click, $index is only the index of the last object in the JSON array in all the cases where the html is generated using ng-repeat.

I was expecting the respective venue or venue.id to be passed as an argument to shortlistThis(). I'm guessing that this could be an issue related to event binding.

Can someone help me understand what's going wrong here and probably a better way to do this if possible.

I did try checking this Bind ng-model name and ng-click inside ng-repeat in angularjs The fiddle here works just fine but, mine doesn't.

Here's a fiddle that you can look into. Just zoom out a bit, click on any name on the left pane and then, hit the shortlist button to see an alert. The alert value is 7 in all the cases.

http://jsfiddle.net/yashwanthm/mos9rvvs/

[Yashwanth Maheshwaram]

Hi Senthil,

Tried that just now. That sounded to be valid but it didn't help. Any other reasons that you can think of ?

On Mon, Mar 2, 2015 at 5:35 PM, Senthil Kumar <mynam...@gmail.com> wrote:

i am just guessing  this , 

              <div ng-repeat="venue in venues" ng-mouseover="" class="venue">

                     <div ng-controller="manageInfo" >

the ng-controller is with in the repeat it is correct? 

try to change 

                     <div ng-controller="manageInfo" >

              <div ng-repeat="venue in venues" ng-mouseover="" class="venue">

--
You received this message because you are subscribed to a topic in the Google Groups "AngularJS" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/3tvQsFvXYc8/unsubscribe.
To unsubscribe from this group and all its topics, send an email to angular+u...@googlegroups.com.
To post to this group, send email to ang...@googlegroups.com.
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.

--

Cheers!

Yashwanth Maheshwaram

 

[Senthil Kumar]

i think the code had nested controllers, ng-repeat  is repeated the html tags so the controllers are repeated.

[Yashwanth Maheshwaram]

I've found something interesting here. When the shortlist button is placed just under the ng-repeat, it works as intended. But when, nested inside a div with a ng-class, it isn't working as intended. Can anyone explain and suggest a fix for this ?

[Senthil Kumar]

hi,

Nested controllers is possible but the ng-repeat repeats 

one more time the same controller then start issues 

 i am not worked in nested controllers 

i think it need clear nested hierarchical variable  management

[Sander Elias]

Hi Yashwanth,

I have looked into your example. It's very hard to read trough because all of the nesting that is going on there. That is also the rout cause of your issue. When things are nested this deep, it becomes very hard to reason on what happens when. This causes confusion. There are even names for this. In the angular context that name is 'scope soup' and for HTML it's called 'divitus'.  If you want to figure out more about this, google those terms and you will find a wealth of information.

The best way to solve your issue in this case, is switch to the 'controller as' syntax. When you do this, you problem will disappear, or at least will become very obvious. 

A good guide you can follow, that also explains why you should use the 'controller as' syntax is John Papa's styleguide

Hope this helps you a bit,

Regards

Sander