current community

your communities

more stack exchange communities

Stack Exchange
tour help
stack overflow careers
Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote 0 down vote favorite

I currently have a fairly simple table that looks as follows:

<table id="responseGrid">
    <tbody>
        <tr id="response" data-ng-repeat="response in data.responses">
            <td id="Resp Key">{{response.key}}</td>
            <td id="Resp Value">{{response.value}}</td>
        </tr>
    </tbody>
</table>

However, if more than one row is created, then each table column would have the same ID. I want for each table column to have a unique ID based on the row. For instance, I want for the first row to have columns with the ids "Resp Key 1" and "Resp Value 1", then the next row would have columns with the ids "Resp Key 2" and "Resp Value 2", and so on.

Is there some way to do that in Angular JS? I tried looking for some sort of way of getting the index of the response that I am on, but that doesn't seem to work. Also, I can't figure out a way to concatenate an ID (although that may be more of an HTML issue). Any help is appreciated.

share|improve this question
    
Curious as to why you need to specify ids for these items? Ideally any access you need to the response object would be via the child scope generated by ng-repeat. –  mccainz Oct 15 at 18:39
    
@mccainz I was asked to have them be unique so that our testing framework (Twist) could reference the columns and confirm if the contents were correct. If I'm going in the wrong direction, feel free to point me in the right direction, but we'll keep this question as is since there could be a legitimate reason to use it. –  Thunderforge Oct 15 at 18:42
    
understood - but in that case could the IDs simply be totally random or is the structure of the ID required by the testing framework? –  mccainz Oct 15 at 18:47
    
The way we have it set up, the tests have hardcoded references to the IDs. For instance, the test might check whether the contents of table column with ID "Resp Key 1" is equal to "Foo" and "Resp Key 2" is equal to "Bar". We don't have it set up where we can dynamically query what the id of the column is, so random ones won't work. –  Thunderforge Oct 15 at 18:49

1 Answer 1

up vote 1 down vote accepted

you can do somthing like this $index is the index of the array

    <tr id="response" data-ng-repeat="response in data.responses">
        <td id="{{'Resp Key '+($index+1)}}">{{response.key}}</td> // this will result in `Resp Key 1`,`Resp Key 2` ..
        <td id="{{'Resp Value '($index+1)}}">{{response.value}}</td>
    </tr>
share|improve this answer
    
This works, but it's zero-based indexing and I've been asked to make it one-based indexing. Is it possible to change? I tried to add one to the index, I wound up with "Resp Key 01", so it looks like I was doing string concatenation instead. –  Thunderforge Oct 15 at 18:40
    
updated answer please check. you can use ($index+1) instead of $index –  Kalhano Toress Pamuditha Oct 15 at 18:44
    
Works great, thanks! –  Thunderforge Oct 15 at 19:18

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.