Framework7-templates-load-template

テンプレートを直接読み込む

説明

テンプレートを動的ページとしてオンザフライでレンダリングおよびロードすることもできます。 次のコードは、動的ページとしてのテンプレートの使用を示しています-

インデックス

<script type = text/template7" id = about">
   <div class = pages">
      <div data-page = about" class = page">
         <div class = page-content">
            <div class = content-block">
               <div class = content-block-inner">
                  <p>Hello, i am <b>{{firstname}} {{lastname}}</b>,
                     <b>{{age}}</b> years old and working as <b>{{position}}</b>
                     at <b>{{company}}</b>.</p>
               </div>
            </div>
         </div>
      </div>
   </div>
</script>

Copy

必要なデータは_template7Data_から取得されます。 必要なテンプレートを指定するには、テンプレートIDで_data-template_属性を使用する必要があります。

次の例に示すように、JavaScriptビューの_.load（）_メソッドと_template_プロパティを使用して、カスタムデータを渡すことができます-

mainView.router.load ({
   template: Template7.templates.aboutTemplate,
   context: {
      firstname: 'William',
      age: 27
   }
})

Copy