0

我正在开发一个带有 framework7 的 android 应用程序,它将显示一些车辆信息。第一个屏幕将包含一个包含车辆类型的列表,用户可以选择一种类型,然后转到带有子类别的下一个屏幕。我想使用把手“{{}}”显示网站中每个集合的上下文。我用类型做了第一个屏幕,但我想知道是否可以使用车把在不同的行中显示每种车辆类型的子类别(用户将按下并将他带到下一页,该页面将包含信息对于用户选择的子类型)。
我有一个包含以下代码的 json 文件:

    [
    { "id" : 1,
      "Vehicle type": "Hatchback"
      "Subtypes": "st1", "st2", "st3"
    },
    { "id" : 1,
      "Vehicle type": "motorcycle"
      "Subtypes": "mt1", "mt2", "mt3"
    }
    ]
4

1 回答 1

0

如果你想使用车把 {{}},你需要有一个模板

  1. 例如:

    <script id="template" type="text/template7">
        {{#each records}}
            <p>Vehicle type is:  {{Vehicle type}} </p>
        {{/each}}
    </script>
    
  2. 使用 Template7 编译模板:

    var template = $$('#template').html();
    var compiledTemplate = Template7.compile(template);
    
  3. 从服务器获取 JSON 数据:

    $$.getJSON('link/to/your/json', {}, function (data) {          
        var context = data;
    }
    
  4. 现在通过传递所需的上下文来渲染编译的模板

    var html = compiledTemplate(context);
    

现在,该html变量将包含您需要的 html。例如:

    <p>Vehicle type is: Hatchback</p>
    <p>Vehicle type is: motorcycle</p>

注意此代码尚未经过测试。第一步中的“记录”需要替换为 JSON 文件中的根节点。

于 2016-04-22T10:49:32.333 回答