coreui-angular-ex/projects/coreui-angular/src/lib/utilities/visible.directive.ts

CoreUI Components Library for Angular

import { Directive, Input, TemplateRef, ViewContainerRef } from '@angular/core';

@Directive({
  selector: '[cVisible]',
  standalone: true
})
export class VisibleDirective {

  constructor(
    private templateRef: TemplateRef<any>,
    private viewContainer: ViewContainerRef
  ) { }

  private hasView!: boolean;

  @Input() set cVisible(condition: boolean) {
    if (condition && !this.hasView) {
      this.viewContainer.createEmbeddedView(this.templateRef);
      this.hasView = true;
    } else if (!condition && this.hasView) {
      this.viewContainer.clear();
      this.hasView = false;
    }
  }

}