Hi how to show data in aura:iteration in the below format, attribute is of type strings[].

a b
c d
e f
g ..

closed as off-topic by glls, Patlatus, Ratan Paul, Dave Humm, battery.cord Dec 12 '17 at 14:08

This question appears to be off-topic. The users who voted to close gave this specific reason:

  • "Questions on problems in code you've written must describe the specific problem and include valid code to reproduce it. For help writing short, self-contained syntactically-valid examples, see: SSCCE.org" – glls, Patlatus, Ratan Paul, Dave Humm, battery.cord
If this question can be reworded to fit the rules in the help center, please edit the question.

  • can you please post your code – SFDC FAN Dec 11 '17 at 12:47
  • @AnnappaPH: i need to show in the given format. <aura:iteration items="{!v.test}" var="testing"> {!testing} </aura:iteration> – Effat Naaz Dec 11 '17 at 12:49
  • 1
    Then add values to the list like this <aura:attribute name="test" type="String[]" default="['a b', 'c d', 'e f', 'g ..']" /> and this is just an example do the same in the JS where you are adding values in this List instead of adding a single value on a index add two values. – itzmukeshy7 Dec 11 '17 at 13:17
  • @itzmukeshy7: a is one data, b is one data and c and so on. I want to display in above format, its an example which i have shown. U got the question in wrong sense. – Effat Naaz Dec 11 '17 at 13:20
  • Maybe you are right. So how you are putting data in the list. – itzmukeshy7 Dec 11 '17 at 14:24

Use the slds grid system to do this. Firstly study about Grid in Lightning Design System.


you can also achive this using refer Lightning:layout

Sample Code

<aura:application extends="force:slds">
    <div class="slds-grid slds-wrap">
        <aura:iteration items="['a','b','c','d','e','f']" var="test">
            <span class="slds-size_1-of-2">{!test}</span>
    <lightning:layout multipleRows="true">
        <aura:iteration items="['a','b','c','d','e','f']" var="test">
            <lightning:layoutItem padding="around-large" size="6" smallDeviceSize="12" mediumDeviceSize="6">
    </lightning:layout  >

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