Global Context problem updating the data.... with infinite scroll method

I have this in data function on enter page for instance:

var app = new Framework7({
data: function () {
return {
userName: ‘johndoe’,

then inside the method loadMore I update the name using: = ‘othername’

in my handlebar template I print


the problem it is that {{userName}} is not updated when printing the data in the template…

I am using Infinite scroll and loadMore function is run everytime I reach the bottom of the list adding a new card from a template var… containing {{userName}} but the name showing it is always johndoe in every new card added…

How can I update or change the content of the global var userName in this case?