How to pass content while calling app.router.navigate() in Framework7? - frameworks

Question

Here is the dynamic page route:
{
path: '/news/',
name:'news',
content: '<div class="page newPage"><div class="page-content"><div class="block"><p> This page created dynamically</p></div></div></div>',
}
I am calling the dynamic page like this:
app.router.navigate({name:'news'});
My question is how to change the content of that page by passing some parameters, something like this:
app.router.navigate({name:'news', new-content:'<div>Hi new content</div>'});

Answer 1

try to append your content or any variable to ( params ) before you navigate
app.router.params["PageMode"] = "new";
app.views.main.router.navigate({name:'newbill'});
then you can receive it when page init
$(document).on('page:init', '.page[data-name="newbill"]', function (page) {
console.log(app.router.params.PageMode);
});

Answer 2

The content to a page are passed in through the routes for example :
routes = [
{
path: '/news/:id/:content',
url: 'somepage.html'
}
]
so when you sending the parameters to the route you will simply do like :
var id = parseInt(someNewsID);
var content = 'Lorem ipsum ...........';
app.mainView.router.navigate('/news/' + id + '/' + content);
making sure you are separating your variables with a slash as in the path
Retrieving the values will be as simple as :
var myID = app.mainView.router.currentRoute.params.id;
var myContent = app.mainView.router.currentRoute.params.content;
and then you can manipulate your dom using JavaScript or JQuery to load the values and use them