Получить атрибуты первого объекта в угловой асинхронной трубе

Question

Я использую rxjs и angular 6, и у меня есть следующий простой html для рендеринга группы данных через асинхронный канал

          <div *ngIf='results | async ; let items '>                                                
            <div *ngFor='let item of items'>
              <div>                    
                {{item.name}} already exists
              </div> 
            </div> 
          </div>

Теперь я не хочу рендерить их все, только первыйодин, поэтому я пытаюсь сделать что-то вроде

          <div *ngIf='results | async ; let items '>                                                
            <div *ngIf='items.length>0'>
              <div>                    
                {{items[0].name}}  already exists
              </div> 
            </div> 
          </div>

items[0] не дает ошибок и items[0].name работает, но я получаю Cannot read property 'name' of undefined в консоли.

Как это исправить?

Спасибо

Answer 1

<div *ngIf='results | async ; let items;'>                                                
  <div>{{items[0]?.name}}  already exists</div> 
</div>