framework7虚拟列表没有条目

时间:2017-01-10 13:11:31

标签: json html-framework-7

我尝试用json在framework7中创建一个虚拟列表。在Chrome中没有错误。当我把json写到控制台时,我看到了。我不知道出了什么问题。

也许你可以帮助我。

var template = $$('#customer-template').html();

// Compile and render
var compiledTemplate = Template7.compile(template);

// Defined as function "getrandom"
function getrandom() {
  // Get JSON Data from UrbanDictionary API
  $$.getJSON('../api.php?getCustomer', function (json) {
    console.log(json);
      $$('#content-wrap').html(compiledTemplate(json))
  });
};

// Execute to list UrbanDictionary Definitions
getrandom();

这是我的html部分

 <div id="view-2" class="view tab">
        <div class="pages">
          <div data-page="index-2" class="page">
            <div class="page-content">
              <div class="content-block">
                <div id="content-wrap"></div>
                <script id="customer-template" type="text/template7">
                   <div class="list-block media-list">
                     <ul>
                       {{#each list}}
                       <li><a href="details.html" class="item-link">
                           <div class="item-content">
                             <div class="item-inner">
                               <div class="item-title">{{surname}}, {{forename}}</div>
                             </div>
                           </div></a></li>{{/each}}
                     </ul>
                   </div>
                 </script>
              </div>
            </div>
          </div>
        </div>
      </div>

我的json看起来像这样

   [
  {
    "cid": "266",
    "title": "",
    "surname": "Kiefer",
    "forename": "Peter",
    "company": "sdfg",
    "role": "CEO",
    "position": "",
    "tel_work": "0123456789",
    "tel_mobile": "0123456789t",
    "fax_work": "0123456789",
    "adr_work_street": "sdfg",
    "adr_work_zip": "sdfg",
    "adr_work_place": "sdfg",
    "adr_work_country": "sdfg",
    "email_work": "sdfg",
    "website": "sdfg"
  }
]

1 个答案:

答案 0 :(得分:0)

{{#each list}}更改为{{#each this}},或将json客户数组命名为list并使用{{#each this.list}}

更多信息:http://framework7.io/docs/template7-pages.html#plain-data-objects