带有Famework7的Template7仅适用于索引

时间:2017-05-01 17:38:39

标签: javascript cordova firebase firebase-realtime-database html-framework-7

我尝试在2个不同的framework7和模板7页面中从Firebase加载数据。

不幸的是只能在索引页面上工作。我不知道为什么。 这是我的HTML代码。

<script id="calendario" type="text/template7">
              <div class="title">Calendario</div>

                {{#each Tornei}}

                <a href="calendario-detail.html" class="eventblock w-inline-block item-content item-link" data-context-name="Tornei.{{@key}}">
                  <div class="w-row">
                    <div class="nopadding w-col w-col-6 w-col-small-6 w-col-tiny-6">
                      <div class="smalltext">{{this.Location}}</div>
                    </div>
                    <div class="nopadding w-col w-col-6 w-col-small-6 w-col-tiny-6">
                      <div class="smalltext">{{Location}}</div>
                    </div>
                  </div> 
                  <div class="titleevent titologreen">{{@key}}</div>
                  <div class="smalltext">4 / 8</div>
                </a>

              {{/each}}

这是myapp.js

myApp.onPageInit('calendario', function (page) {

       var ref = firebase.database().ref("/");

       ref.on("value", function(snapshot) {

         var template = $$('#calendario').html();
         var compiledTemplate = Template7.compile(template);

         var ourGeneratedHTML = compiledTemplate(snapshot.val());
         console.log(snapshot.val());
         $$('#1').html(ourGeneratedHTML);

         $$('.eventblock').on('click', function () {
           var nameEvent = $$(this).children('.titleevent').text();
           mainView.router.loadPage("calendario-detail.html?eventName=" + nameEvent);
         });
       });
  }).trigger();

     myApp.onPageInit('calendario-detail', function (page) {

          var ref = firebase.database().ref("/");

         ref.on("value", function(snapshot) {

            var template = $$('#calendario-detail').html();
            var compiledTemplate = Template7.compile(template);

            var last = JSON.stringify(snapshot.val())

            console.log(last);
            var ourGeneratedHTML = compiledTemplate(snapshot.val());
            console.log(snapshot.val());
            $$('#1').html(ourGeneratedHTML);
            console.log(ourGeneratedHTML);

         });
  });

正如您所看到的,它们是相同的,但template7仅适用于我的索引。

你可以帮帮我吗?感谢。

1 个答案:

答案 0 :(得分:0)

我有同样的问题,所以,我初始化我的应用程序:

var myApp = new Framework7({
    // Unable templates auto precompilation
    precompileTemplates: false,
    // Unabled pages rendering using Template7
    template7Pages: false,
});

之后我可以使用onPageAfterAnimation在其他视图上编译模板。