Вложенный массив в Firebase с jQuery / JavaScript

Question

Я буду загружать информацию в файл JSON, а затем импортировать ее в Firebase для загрузки на мой сайт. У меня есть образец JSON, как это ...

{
            "date": "date of event",
            "title": "title of event",
            "address": "address",
            "city": "city of event",
            "state": "HI",
            "zip": "11111",
            "available": true,
            "cost": "$60",
            "included": [
                "string1",
                "string2",
                "string3"
            ]
        }

У меня есть следующий код.

 database.ref().child('events').once('value', function(snapshot) {
    if (snapshot.exists()) {
      var content = '';
      snapshot.forEach(function(child) {
        var val = child.val();
        content +='<tr>';
        content += '<td>' + val.date + '</td>';
        content += '<td>' + val.title + '</td>';
        content += '<td>' + val.address + '</td>';
        content += '<td>' + val.city + '</td>';
        content += '<td>' + val.state + '</td>';
        content += '<td>' + val.zip + '</td>';
        content += '<td>' + val.cost + '</td>';
        content += '<td>' + val.included + '</td>';
        content += '</tr>';
            });
            $('#ex-table').append(content);

    }
  });

Все хорошо, кроме включенной части. Прямо сейчас это будет печататься как string1,string2,string3. Как бы я перебрать этот массив и распечатать их как ...

Строка 1

Строка 2

Строка 3

Или даже преобразовать строковые значения в img. Например, если мы предложим кофе или еду, это будет значок, представляющий это.

Answer 1

Переберите включенный массив и добавьте td к content.

database
  .ref()
  .child('events')
  .once('value', function(snapshot) {
    if (snapshot.exists()) {
      var content = '';
      snapshot.forEach(function(child) {
        var val = child.val();
        content += '<tr>';
        content += '<td>' + val.date + '</td>';
        content += '<td>' + val.title + '</td>';
        content += '<td>' + val.address + '</td>';
        content += '<td>' + val.city + '</td>';
        content += '<td>' + val.state + '</td>';
        content += '<td>' + val.zip + '</td>';
        content += '<td>' + val.cost + '</td>';
        val.included.forEach((s) => {
          content += '<td>' + s + '</td>';
        });
        content += '</tr>';
      });
      $('#ex-table').append(content);
    }
  });