How to use content in resolve (async route)

Questions
1

F7 version 5.3.2

Hello,

i use route async to get simple html via ajax request.
I don’t know how to use my data response in content property of resolve.

I try:

content: “.page-temp”
content:data
content: $$(".page-temp")

This is my route

  {
    path: '/ordini/:tipo/:id/',
    name: 'dettaglioOrdine',
    async: function (routeTo, routeFrom, resolve, reject) {
      if (isAutenticato) {
        var router = this;
        var app = router.app;      
        app.preloader.show();
        var sTipo = routeTo.params.tipo
        var iID = routeTo.params.id
        appInfoser.request({
          url: urlAPI + "/ordini/ordine/?id=" + iID + "&p=" + sTipo,
          xhrFields: {withCredentials: true},           
          method: 'GET',
          crossDomain: true,
          timeout: 2000,
          processData: true,
          dataType: 'text',
          beforeSend: function (xhr) { 
              xhr.setRequestHeader("Authorization", 'Bearer ' + appToken);
          },        
          error: function (xhr, status) {
            app.preloader.hide();
            alert('Si è verificato un errore di comunicazione, riprovare');
            reject();
          },
          success: function (data, status, xhr) {
            $$('.navbar-inner .title').text('Dettaglio ordine');
            app.preloader.hide();
            $$(".page-temp").html(data);
            resolve({
              content: ".page-temp"
              },{
                context: {
                  cache: false,
                  xhrCache: false,
                }
              }
            )          
          }
        })
      }
    }
  },

Thanks!
David

2

Take a look at the async features.

https://framework7.io/docs/routes.html#async-route

  async: function (routeTo, routeFrom, resolve, reject) {
          // Requested route
          console.log(routeTo);
          // Get external data and return template7 template
          this.app.request.json('http://some-endpoint/', function (data) {
            resolve(
              // How and what to load: template
              {
                template: '<div class="page">{{users}}</div>'
              },
              // Custom template context
              {
                context: {
                  users: data,
                },
              }
            );
          });
3

Thanks for your answer,
but my problem is in the content, not the context.

parameters object - object with resolved route content. Must contain one of url , content , template , templateUrl , component or componentUrl properties

4

when you want to do it, it will do your job to bring it with ajax

 {
    template: result  // template you take with ajax
  },
1 Like
5

If you are using content?! then content suppose to receive full HTML content of the page, like

content: `<div class="page">....</div>`
6

Thanks! I resolve add the code