Ember dynamically update template (array item)

I am using Ember version 2 and have my component template as below;

{{#each info as |item|}}
    <span class="value">{{item.value}}</span>
    <span class="label">{{t item.label}}</span>
{{/each}}

Now I want to write values to it dynamically (i.e. assume it is a dynamic total which initially is 0 & updates automatically based on user selection of some rows)

My question is while the below code works;

var info = self.get('gridParas.info');
info.popObject();
info.pushObject({
    label: 'MyTotalField',
    value: total
});
self.set('gridParas.info', info);

This does not work;

var info = self.get('gridParas.info');
info.label = "MyTotalField";
info.value = total;
self.set('gridParas.info', info);

Is the popObject(), pushObject() the correct way ? What is wrong with the 2nd approach ? I wanted to avoid pop, push each time.