Création composant generique utilisant in viewport

src/lib/aitp-utils.module.ts

 import {NgModule} from '@angular/core';
 import {CommonModule} from '@angular/common';
 
+import * as Components from './components';
 import * as Directives from './directives';
 import * as Services from './services';
 
 @NgModule({
   imports: [CommonModule],
-  declarations: [Directives.InViewportDirective],
+  declarations: [Directives.InViewportDirective, Components.InViewportComponent],
   providers: [Services.ViewportService],
-  exports: [Directives.InViewportDirective]
+  exports: [Directives.InViewportDirective, Components.InViewportComponent]
 })
 export class AitpUtilsModule { }

src/lib/components/in-viewport/in-viewport.component.html

+<div (inViewport)="showMyElement = $event.isIntersecting" aiutInViewport>
+  <ng-content *ngIf="showMyElement"></ng-content>
+</div>

src/lib/components/in-viewport/in-viewport.component.ts

+import {Component} from '@angular/core';
+
+@Component({
+  selector: 'aiut-in-viewport',
+  templateUrl: './in-viewport.component.html'
+})
+export class InViewportComponent {
+  showMyElement: false;
+}

src/lib/components/index.ts

+export * from './in-viewport/in-viewport.component';

src/public_api.ts

@@ -3,6 +3,7 @@
  */
 
 export * from './lib/aitp-utils.module';
+export * from './lib/components';
 export * from './lib/directives';
 export * from './lib/operators';
 export * from './lib/services';