Ext.XTemplate subfields and parents

Data

{
  "seminar_date_info": {
    "ymd": "2019-07-28",
    "timestamp": 1564300800,
    "year": 2019,
    "month": 7,
    "day": 28,
    "hour": 10,
    "time": "10:00:00",
    "shortTime": "10:00",
    "dayName": "Sonntag",
    "shortDayName": "So.",
    "minDayName": "So",
    "monthName": "Juli",
    "shortMonthName": "Juli",
    "week": 30,
    "weekOfYear": 30,
    "dayOfYear": 209,
    "daysInMonth": 31,
    "isoWeek": 30,
    "weekday": 6,
    "isoWeekday": 7,
    "locale": "de",
    "localeDate": "28.07.2019"
  },
  "seminar_dates_info": [
    {
      "sd_id": 862,
      "sd_sr_id": 6663,
      "sd_date": "2019-07-28",
      "sd_time": "10:00:00",
      "sd_duration": "8.00",
      "sd_description": "",
      "dates_info": {
        "sd_date_locale": "28.07.2019",
        "sd_date_ymd": "2019-07-28",
        "sd_week": 30,
        "sd_weekday": 6,
        "sd_day_name": "Sonntag",
        "sd_day_short": "So",
        "sd_time": "10:00"
      }
    }
  ]
}

Ext.XTemplate

In the sample below we are using the data from the JSON above and we solve the problem with the duration field by:

{[parent.sd_duration]}

{
   xtype: 'templatecolumn',
   text: 'Datum/Zeit/Dauer',
   tpl: new Ext.XTemplate(
      '<div style="padding-bottom:5px;">',
      '<div><i class="fa fa-calendar orange"></i> <b>{seminar_date_locale}</b>&nbsp;({seminar_date_minDayName}) - Kw:&nbsp;<b>{seminar_date_week}</b></div>',
      '<div><i class="fa fa-clock-o orange"></i> <b>{seminar_date_time}</b> Uhr ({duration} Std.)</div>',
      '</div>',
      '<tpl if="this.hasDates(seminar_dates_info)">',
      '<tpl for="seminar_dates_info">',
      '<tpl for="dates_info">',
      '<div><i class="fa fa-calendar-o orange"></i> <b>{sd_date_locale}</b>&nbsp;({sd_day_short}) - Kw:&nbsp;<b>{sd_week}</b></div>',
      '<div><i class="fa fa-clock-o orange"></i> <b>{sd_time}</b> ({[parent.sd_duration]} Std.)</div>',
      '</tpl>',
      '</tpl>',
      '</tpl>',
      {
         hasDates(dates) {
            return dates.length > 0;
         }
      }
   ),
   width: 160
}