2016-04-21 35 views
0

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

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

回答

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数据:通过传递所需的背景

    var html = compiledTemplate(context); 
    

现在

$$.getJSON('link/to/your/json', {}, function (data) {   
    var context = data; 
} 
  • 现在呈现编译模板时,html变量将包含你所需要的HTML 。例如:

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

    N.B.此代码尚未经过测试。第一步中的'记录'需要由JSON文件中的根节点替换。

  • +0

    我做了这些问题,我有我想要的东西像一个声明打印每个子类别到下一页! – noel293

    +0

    啊哈!在这种情况下,你可以使用'data [0]'或'data [1]'等作为'context'。您还需要一个不同的模板,但这样您可以选择要显示的条目。 –

    +0

    有没有我能看到的例子? – noel293