написание и ng-шаблон для поля объекта

Question

Используя сетку Kendo Ui, я пытаюсь показать данные из API, который возвращает сложный Jason

В последнем столбце, если я пытаюсь получить доступ к свойству «media», я получаю объект из этого json , поэтому я сослался только на нужное поле из этого свойства

Проблема в том, что я хочу получить все это в шаблоне NG с тегом html следующим образом:

<img src="{{media[0].media-metadata[0].url}}>

it не работает

<kendo-grid [data]="gridData" [height]="600" [pageable]="false" [sortable]="true" >
<kendo-grid-column field="section"  title="Section" autoSize="true"> 

</kendo-grid-column>
<kendo-grid-column field="title" title="Title" ></kendo-grid-column>
<kendo-grid-column field="url" title="Url"  >
  <ng-template kendoGridCellTemplate let-dataItem>
                     <span><a href="{{dataItem.url}}"><i class="material-icons">link</i></a></span>
                  
                </ng-template>
</kendo-grid-column>
<kendo-grid-column field="published_date"  title="Published Date" autoSize="true"> 

</kendo-grid-column>
<kendo-grid-column field="media[0].media-metadata[0].url" title="img" >
  
 
</kendo-grid-column>

</kendo-grid>