json файл на руль

Я разрабатываю приложение для Android с framework7, которое покажет некоторую информацию о транспортных средствах. Первый экран будет содержать список с типами транспортных средств, и пользователь может выбрать один тип, а затем перейти к следующему экрану с подкатегориями. Я хочу показать контексты каждого набора на веб-сайте с помощью руля "{{}}". Я сделал первый экран с типами, но мне было интересно, можно ли использовать руль для отображения подкатегорий каждого типа транспортного средства в другой строке (которую пользователь нажмет и перенесет его на следующую страницу, которая будет иметь информацию для подтипа, выбранного пользователем).
У меня есть файл json со следующим кодом:

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

android json handlebars.js html-framework-7
person noel293    schedule 21.04.2016    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Если вы хотите использовать руль {{}}, вам нужен шаблон

  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.

person Tim V    schedule 22.04.2016
comment
Я сделал это, и у меня возникла проблема: я хочу что-то вроде оператора, печатающего каждую подкатегорию на следующей странице! - person noel293; 22.04.2016
comment
Ага! В этом случае вы можете использовать data[0] или data[1] и т. д. в качестве context. Для этого вам также нужен другой шаблон, но таким образом вы можете выбрать, какую запись вы хотите отобразить. - person Tim V; 22.04.2016
comment
есть ли пример, который я могу увидеть? - person noel293; 22.04.2016