Angular 5: Рендер детей в родителя

[rentgenius]

Всем доброго дня.
Имеем Angular 5

Есть шаблон:

<books>

 <book>
  <title>Книга 1</title>
  <author>Автор книги 1</author>
  <content>Краткое описание 1</content>
 </book>

 <book>
  <title>Книга 2</title>
  <author>Автор книги 2</author>
  <content>Краткое описание 2</content>
 </book>

</books>

Вывожу все компонентами - все гуд.
Понадобилось собрать все заголовки книг и вывести их отдельно от вывода самих книг.

Т.е. шаблон компонента books будет что то типа этого:

<li *ngFor="let book of books">{{book.title}}</li> <ng-content></ng-content>

Список книг получаю так:

@ContentChildren(Book) books: QueryList<Book>;

Но в {{book.title}} вместо названия книги получаю [object Object]

Куда копать? Видимо Angular получает так книгу, но как её рендерить?

Компонент book:
template: '<ng-content></ng-content>'
...

@ContentChild(BookTitle)
title: BookTitle;

PS> шаблон должен быть именно в таком варианте

[destus]

rentgenius,
ещё код компонента Book нужен

[destus]

rentgenius,
https://stackblitz.com/edit/angular-...p.component.ts

[rentgenius]

rentgenius,
https://stackblitz.com/edit/angular-...p.component.ts

Спасибо!
А если нужно будет в <title> вставить другой компонент, как лучше сделать? Или условия для title

[destus]

rentgenius,
Ну если вставить другой компонент, то просто поменяется условие для ContentChild. В качестве селектора передавать не template variable, а класс компонента, в котором и определять геттер для текста.

Хотя очень странно видеть такие штуки в коде. Все таки эти данные не в коде прописаны ведь, а получаются откуда-нибудь с сервера. А данные хранят на уровне сервиса, который можно подключить в компонент books и выводить названия книг списком. Но я не знаю как устроено все у вас)

[rentgenius]

destus,
Вроде все проще, но не пойму как)
Чтобы смог работать такой вариант:

<books>

 <book>
  <title><icon>red-book</icon>Книга 1</title>
  <author>Автор книги 1</author>
  <content>Краткое описание 1</content>
 </book>

 <book>
  <title><icon>green-book</icon>Книга 2</title>
  <author>Автор книги 2</author>
  <content>Краткое описание 2</content>
 </book>

</books>

Т.е. такой вариант отрабатывает в шаблоне, но когда начинаешь по циклу прогонять title, то тут засада(((