How to render a component within a component?

Question

JavaScript

There is a component

'use strict';

angular
    .module('buzz')
    .component('commonHeader', {
        templateUrl: "/views/header.html",
        controller: function ($scope, globalRatingApiService) {}
    .component('leftBlock', {
    templateURL: "/views/headerLeft.html",
    controller: function () {
      console.log('ASD');
        }

A component has been added to index.html Another component has been added to header.html If templateUrl is replaced with template: "" in leftBlock , then the tag is displayed in the dom, but is not pulled from the template, why is that?
<common-header></common-header>
<left-block></left-block>

Answer 1

everything is correct. template: "" says that the content is empty. if you do not specify a template at all, then it will be taken from the fact that between the tags and