[SalesForce] Aura Iterate, get the aura:id of a span

I'm trying to get the ID of an element that is in a loop to trigger an event, but I can't get the ID nor content of the tag.
I've done something similar on visual force pages, but I did it manipulating the DOM which I want to avoid in the lightning component ecosystem…
any ideas?

I've tried event.getSource(), event.target, changing to a lightning:badge putting the span in it's own div but nothing seemes to work
this is my component…
I've seen this was a problem last year, but I post this anyway because I guess someone already solved this, without DOM manipulation. 

<aura:component>
    <aura:attribute name="numberList" type="Object[]" access="private"/>
    <aura:iteration items="{!v.numberList}" var="obj">
        <span aura:id="{!obj.num}" class="{!obj.state}" onclick="{!c.numSelected}">
            {!obj.num}
        </span>
    </aura:iteration>
</aura:component>

Best Answer

When you're using normal HTML, you have a lot of flexibility in what you do with this. One solution not involving the use of id is to set a data attribute on the span:

<aura:component>
    <aura:attribute name="numberList" type="Object[]" access="private"/>
    <aura:iteration items="{!v.numberList}" var="obj">
        <span data-num="{!obj.num}" class="{!obj.state}" onclick="{!c.numSelected}">
            {!obj.num}
        </span>
    </aura:iteration>
</aura:component>

({ numSelected: function(component, event) {
     alert("You selected: " + event.target.dataset.num);
   }
})

Other variants of this technique are also possible.

Related Topic