Handle Params in Route V3.4.0


#1

Hi everyone, i am new at Framework7.

I have a link <a href='/test/:myparam/'>go</a>

I want handle this param in route, route.js.

Route.js;

       {
        path: '/test/:myparam/',
        templateUrl: './pages/test.html',
         // i want handle here.
        }

How can i do that?


#2

why don’t you just use async routes

 path: '/your-path/:param1/:param2/',
 async: function (routeTo, routeFrom, resolve, reject){
       
   var router = this;
  
  var app = router.app;

  var param1 = routeTo.params.param1;
  var param2 = routeTo.params.param2;

app.request({
....
success: fuction(data){
   
reject();  //stay on same page and may be redirect somewhere else... eg: router.navigate('/another-path/')...

//or resolve to your template like:
resolve({
templateUrl: './pages/test.html',

//if you have some context too, (optional)
context: {
data1: data1,
data2: data2,
}
})

}
})
}

Keep in mind, that all routing is paused until resolve({}) or reject()… That will save our day…

OR:

On your template (COMPONENTS ARE WAY A BETTER CHOICE THAN TEMPLATES ON ANY DAY BECAUSE, with components, you can even use JS on the same page…), but well if you insist… in your template… Use something like:

   <li><b>$route.params.param1</b>: {{$route.params.param1}}</li>
   <li><b>$route.params.param2</b>: {{$route.params.param2}}</li>

I will refer you to this still though: https://framework7.io/docs/router-component.html


#3

Also, IN YOUR LINK…<a href='/test/**:**myparam/'>go</a>, what I have put in bold (:) is wrong in your template: Just <a href='/test/myparam/'>go</a> is enough… This :myparam is just a placeholder in your route url…