angularytics: how do I track the ng-repeat that is creating my menu?

Question

I am trying to track what menu button people are choosing. I am using angularytics and it is working correctly. I can see how many times the main menu is clicked but I can not see what category is clicked. For example, my menu is audio video and gps. I need to be able to see how many times audio is being clicked. Any advice would be greatly appreciated.

<md-list-item ng-repeat="item in items">
   <md-button ng-click="toggleLeft($index, item) | trackEvent:'Main Menu':'Button clicked' ">
       <div class="menuText" layout="row" layout-align="center center">
            <div id="blueButton" ng-class="{'active' : selected === $index}">
                                {{ item.name }}
                            </div>
                        </div>
                    </md-button>
                </md-list-item>

Answer 1

All that was needed was a line of code in my controller if using the service that looks like this:

Angularytics.trackEvent(item.name, 'clicked', 'Main Menu');

and to remove the | trackEvent:'Main Menu':'Button clicked' from the html.

This allows me to track each category selected and not just the action Main Menu.

However, you can use the html filter approach as well. It looks like this:

| trackEvent: item.name : 'Button clicked' : 'Main Menu'

Just wanted to update this in case there are any other noobs out there trying to figure this out!