diff --git a/projects/common-map/src/fm-map/components/if-zoom-to-show/if-zoom-to-show.directive.ts b/projects/common-map/src/fm-map/components/if-zoom-to-show/if-zoom-to-show.directive.ts
index 6856a35..b2b8b4e 100644
--- a/projects/common-map/src/fm-map/components/if-zoom-to-show/if-zoom-to-show.directive.ts
+++ b/projects/common-map/src/fm-map/components/if-zoom-to-show/if-zoom-to-show.directive.ts
@@ -3,35 +3,55 @@ import { layer } from 'ol';
 import { MapComponent } from 'ngx-openlayers';
 
 @Directive({
-  selector: '[fm-map-ifZoomToShow]',
+  selector: '[fmMapIfZoomToShow]',
 })
-export class ifZoomToShowDirective  implements OnInit,OnChanges {
-  @Input('fm-map-ifZoomToShow') layer$:layer;
+export class ifZoomToShowDirective  implements OnInit {
+  @Input() 
+  set fmMapIfZoomToShow(layer:layer) {
+    this.layer$=layer;
+    this.checkZoom();
+  }
 
-  constructor(private templateRef$: TemplateRef<any>,private viewContainerRef$: ViewContainerRef,private map$: MapComponent) { }
+  @Input() 
+  set fmMapIfZoomToShowThen(templateRef: TemplateRef<any>) {
+    this.thenTemplate$ = templateRef;
+    this.checkZoom();
+  }
+
+  @Input() 
+  set fmMapIfZoomToShowElse(templateRef: TemplateRef<any>) {
+    this.elseTemplate$ = templateRef;
+    this.checkZoom();
+  }
+  
+  private layer$:layer;
+  private thenTemplate$:TemplateRef<any>;
+  private elseTemplate$:TemplateRef<any>;
   private showView = false;
 
+  constructor(private templateRef$: TemplateRef<any>,private viewContainerRef$: ViewContainerRef,private map$: MapComponent) { 
+    this.thenTemplate$ = templateRef$;
+    this.checkZoom();
+  }
+
   ngOnInit() {    
     this.map$.instance.on('moveend', (e) => {
       this.checkZoom();     
     });
   }
 
-  ngOnChanges() {
-    this.checkZoom();
-  }
-
   checkZoom() {
     if(this.layer$ && this.map$.instance) {
       let minZoom = this.layer$.getMinZoom();
       let currentZoom = this.map$.instance.getView().getZoom();
       let view = currentZoom < minZoom;
       if(view!= this.showView) {
+        this.viewContainerRef$.clear();
         this.showView=view;
-        if ( !this.showView) {
-          this.viewContainerRef$.clear();
-        } else {
-          this.viewContainerRef$.createEmbeddedView(this.templateRef$);
+        if (this.showView && this.thenTemplate$ ) {
+          this.viewContainerRef$.createEmbeddedView(this.templateRef$);          
+        } else if(this.elseTemplate$ ) {
+          this.viewContainerRef$.createEmbeddedView(this.elseTemplate$);
         }  
       }      
     }      
diff --git a/projects/common-map/src/fm-map/components/zoom-to-show-alert/zoom-to-show-alert.component.ts b/projects/common-map/src/fm-map/components/zoom-to-show-alert/zoom-to-show-alert.component.ts
index 5fe8a1f..5babded 100644
--- a/projects/common-map/src/fm-map/components/zoom-to-show-alert/zoom-to-show-alert.component.ts
+++ b/projects/common-map/src/fm-map/components/zoom-to-show-alert/zoom-to-show-alert.component.ts
@@ -3,7 +3,7 @@ import { layer } from 'ol';
 
 @Component({
   selector: 'fm-map-zoom-to-show-alert',
-  template: '<div *fm-map-ifZoomToShow="layer" class="alert alert-info"><i class="fas fa-search-plus" aria-hidden="true" i18n-title title="Add as layer"></i>&nbsp;<span i18n>Zoom in to show layer</span></div>'
+  template: '<div *fmMapIfZoomToShow="layer" class="alert alert-info"><i class="fas fa-search-plus" aria-hidden="true" i18n-title title="Add as layer"></i>&nbsp;<span i18n>Zoom in to show layer</span></div>'
 })
 export class ZoomToShowAlert {
   @Input() layer: layer;