2016-04-21 34 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