arturovt

<ng-template [ngIf]="authorized">
  <ng-container>
    <button>Profile</button>
    <button>Logout</button>
  </ng-container>
</ng-template>

arturovt

<ng-container *ngIf="authorized">
  <button>Profile</button>
  <button>Logout</button>
</ng-container>

arturovt

const comment = document.createComment('');
document.body.appendChild(comment);

const p = document.createElement('p');
const text = document.createTextNode('Hello world!');
p.appendChild(text);

comment.parentNode.insertBefore(p, comment.nextSibling);

arturovt

{
  renderElement: comment, // ссылка на инстанс Comment
  componentView: undefined,
  viewContainer: null,
  template: new TemplateRef_(view, def)
}

arturovt

{
  renderElement: p, // ссылка на инстанс HTMLParagraphElement
  componentView: undefined,
  viewContainer: null,
  template: undefined
}

arturovt

export interface ElementData {
  renderElement: any;
  componentView: ViewData;
  viewContainer: ViewContainerData | null;
  template: TemplateData;
}

arturovt

@Component({
  selector: 'app-some-component',
  template: `
    <ng-template>
      <p>{{ counter }}</p>
    </ng-template>
  `
})
export class SomeComponent {
  public counter = 0;

arturovt

@Component({
  selector: 'app-some-component',
  template: `
    <ng-tempate>
      <p>Hello world!</p>
    </ng-tempate>
  `
})
export class SomeComponent {}

arturovt

@Component({
  selector: 'app-some-component',
  template: `
    <ng-template>
      <p>Hello world!</p>
    </ng-template>
  `
})
export class SomeComponent {}

arturovt

// "256" - это NodeFlags.TypeValueProvider
moduleProviderDef(256, APP_ROOT, true, [])