Как сделать нестандартные угловые элементы многократного использования, как мы делаем в React, используя реквизит

Question

Я хочу сделать что-то вроде этого:

 <my-custom-component attr="sdfsdf">
    <div class="bud">
       HHello
    </div>
 </my-custom-component>

Функциональность, которую я хочу, заключается в том, что любой контент, который я вставляю в открывающий и закрывающий тег моего пользовательского элемента, направляется именно туда, где я хочу, внутри моегопользовательский компонент HTML-код.например:

custom-component.html

 <div>
  hello
  <div> // content goes here if any </div>
 </div>

another-component.html

 <custom-component> bla bla </custom-component>

РЕЗУЛЬТАТ:

 <div>
  hello
  <div> bla bla  // content goes here if any  </div>
 </div>

Iиспользую Angular 7

Answer 1

https://angular.io/guide/lifecycle-hooks#content-projection

Здесь мы можем использовать тег

 <ng-content> 

для указания угла, куда помещать содержимое в компонент при вложении.