Array to push element to array

mpex_app.app

<aura:application extends="force:slds">
  <c:mpex1></c:mpex1>
</aura:application>



CMP

<aura:component>
  <aura:attribute name="objs" type="Object[]" />
  <aura:handler name="init" value="{!this}" action="{!c.doInit}" />
  <table>
    <tr>
      <th>Product</th>
      <th>Price</th>
    </tr>
    <aura:iteration items="{!v.objs}" var="obj">
      <tr>
        <td>{!obj.product}</td>
        <td>{!obj.price}</td>
      </tr>
    </aura:iteration>
  </table>
  <!-- component B -->
  <lightning:button variant="brand" label="Add another" title="Brand action" onclick="{! c.handleClick }" />
</aura:component>

JS

({
  doInit: function(component, event, helper) {
    helper.populateObjectList(component, event);
  },

  handleClick: function(component, event, helper) {
    helper.augmentObject(component, event);
  }
})


helper

({
  populateObjectList: function(component, event) {
    var objs = [];
    objs.push(this.createObj('iPhone', 34000));
    objs.push(this.createObj('Motox', 27000));
    objs.push(this.createObj('Oneplus', 33033));
    component.set('v.objs', objs);
  },

  createObj: function(product, price) {
    var obj = new Object();
    obj.product = product;
    obj.price = price;
    return obj;
  },

  augmentObject: function(component, event) {
    var objs = component.get('v.objs');
    objs.push(this.createObj('Demo', 1000));
    component.set('v.objs', objs);
  }
})
<!-- lightning component -->
<!-- component A -->


Output:

ProductPrice
Phone34000
Motox27000
Oneplus33033


clicking on Addanother button

iPhone      34000
Motox 27000
Oneplus 33033
Demo 1000
Demo 1000