title: hide header and ion-slide from login page globally
body: <p>I REALLY NEED YOUR HELP. I am working on ionic2. I applied header and ion-slide globally by writing coding in app.ts as shown in code. But the issue is header and ion-slide is displayed in Login Page(i.e. Userloginpage.html) also, so i trying to hide this using *ngIf  as shown in app.html and the value(i.e. hideLogin) of *ngIf is set in app.ts in condition like if it is login page then 'hideLogin' is false so that ion-slide and header will not display but  It is not working.</p>
  
  <p>Thank you!</p>
  
  <p>Any help is highly appreciated.</p>
  
  <p>here is app.ts</p>
  
  <pre><code>import { Component, ViewChild } from '@angular/core';
  import { Platform } from 'ionic-angular';
  import { StatusBar } from '@ionic-native/status-bar';
  import { SplashScreen } from '@ionic-native/splash-screen';
  
  import { WalkthroughPage } from '../pages/walkthrough/walkthrough';
  import { LoginPage } from '../pages/login/login';
  import { UserloginPage } from '../pages/userlogin/userlogin';
  import { NetworkconnectionPage } from '../pages/networkconnection/networkconnection';
  import { Geolocation } from '@ionic-native/geolocation';
  
  import { Injectable } from '@angular/core';
  import { Http } from '@angular/http';
  import 'rxjs';
  import { Observable } from 'rxjs/Observable';
  import { AlertController } from 'ionic-angular';
  import { ToastController } from 'ionic-angular';
  import { Network } from '@ionic-native/network';
  
  import { CustomerlistPage } from '../pages/customerlist/customerlist';
  import { ProductPage } from '../pages/product/product';
  import { CustomerPage } from '../pages/customer/customer';
  import { ProfilePage } from '../pages/profile/profile';
  import { WalletPage } from '../pages/wallet/wallet';
  import { MydayPage } from '../pages/myday/myday';
  import { FaqPage } from '../pages/faq/faq';
  import { TargetPage } from '../pages/target/target';
  import { KnowledgebasePage } from '../pages/knowledgebase/knowledgebase';
  import { SupportPage } from '../pages/support/support';
  import { OrderlistPage } from '../pages/orderlist/orderlist';
  import { HomePage } from '../pages/home/home';
  
  import { App } from 'ionic-angular';
  import { Storage } from '@ionic/storage';
  //import { NavController } from 'ionic-angular';
  
  @Component({
    templateUrl: 'app.html'
  })
  
  export class MyApp {
  
    rootPage:any = UserloginPage; 
    platform:any;    
  
    constructor(public app: App,  public storage: Storage,  platform: Platform, statusBar: StatusBar, splashScreen: SplashScreen, private alertCtrl: AlertController, public toastCtrl: ToastController, private network: Network, public geolocation: Geolocation) {
  
      platform.ready().then(() =&gt; {
        statusBar.styleDefault();
        if (splashScreen) {
          setTimeout(() =&gt; {
            splashScreen.hide();
          }, 100);
        }
      });
  
  
     if(UserloginPage){
       this.hideLogin = false;          \\not working properly
     }
  
    }    
  
    customerList(){
      this.app.getRootNav().push(CustomerlistPage);
    }
  
    gotoHome(){
      this.app.getRootNav().push(HomePage);
    }
  
    productList(){
      console.log("Product List");
      this.app.getRootNav().push(ProductPage);
    }
  
    orderList(){
      this.app.getRootNav().push(OrderlistPage);
    }   
  
    signOut(){}
  }
  </code></pre>
  
  <p>here is app.html</p>
  
  <pre><code>&lt;ion-header *ngIf="hideLogin" style="height:55px; background:#63813D" &gt; &lt;!--NOT WORKING--&gt; 
  
      &lt;div style="float:left; margin-top:14px; font-size:26px; padding-left:20px; color:#ffffff;"&gt;
        &lt;!-- &lt;span&gt;&lt;ion-icon name="menu"&gt;&lt;/ion-icon&gt;&lt;/span&gt;&amp;nbsp;&amp;nbsp; --&gt;
        &lt;img src="assets/images/app_tray.png" style="width:20px; height:15px; margin-bottom:5px;"&gt; &amp;nbsp;
        &lt;img src="assets/images/mixbag_logo.png" style="width:100px; height:25px; " (click)="gotoHome()"&gt;
      &lt;/div&gt;
  
      &lt;div style="float:right; margin-right:15px; margin-bottom:49px; margin-top:10px;" (click) = "signOut()"&gt;
        &lt;div style="float:right; font-size:25px; color:#fff; margin-top:2px;"&gt;&lt;b&gt;&lt;img src="assets/images/sign_out.png" style="width:30px; height:30px;"&gt;&lt;/b&gt;&lt;/div&gt;
      &lt;/div&gt;
  
      &lt;div style="float:right; margin-right:15px; margin-bottom:49px; margin-top:7px;" (click) = "profile()"&gt;
        &lt;div style="float:left; margin-top:5px;"&gt;&lt;img src="assets/images/profileuser.jpg" style="width:30px; height:30px; "&gt;&lt;/div&gt;
      &lt;/div&gt;
  
  &lt;/ion-header&gt;    
  
  &lt;div *ngIf="hideLogin" overflow-scroll="false" style="margin-top:48px; background:#fff;"  &gt;  &lt;!--NOT WORKING--&gt;
    &lt;div style="background:#fff; padding-bottom:3px; padding-top:10px;"&gt;
    &lt;div&gt;
      &lt;p class="pslider"&gt;
        &lt;ion-slides autoplay="" speed="50000"&gt;
          &lt;ion-slide&gt;
  
            &lt;table width="100%" border="0"&gt;
              &lt;tr&gt;
                &lt;td style="width:25%; border-right: 1px solid #A1B588;"&gt;
                  &lt;div (click)="customerList()"  style="padding-left:5px; padding-right:5px; margin-bottom:-10px;" &gt;
                    &lt;b&gt;&lt;img src="assets/images/customer_list.png" style="width:50px; height:50px;" /&gt;
                    &lt;p style="margin-top:-1px; font-size:12px; color:#64823A;"&gt;Customer List&lt;/p&gt;&lt;/b&gt;
                  &lt;/div&gt;
                &lt;/td&gt;
  
                &lt;td style="width:25%; border-right: 1px solid #A1B588;"&gt;
                  &lt;div (click)="customerform()" style="padding-left:5px; padding-right:5px; margin-bottom:-10px;" &gt;
                    &lt;b&gt;&lt;img src="assets/images/add_customer.png" style="width:50px; height:50px;" /&gt;
                    &lt;p style="margin-top:-1px; font-size:12px; color:#64823A;"&gt;Add Customer&lt;/p&gt;&lt;/b&gt;
                  &lt;/div&gt; 
                &lt;/td&gt;
  
                &lt;td style="width:25%; border-right: 1px solid #A1B588;"&gt;
                  &lt;div (click)="productList()" style="padding-left:5px; padding-right:5px; margin-bottom:-10px; " &gt;
                    &lt;b&gt;&lt;img src="assets/images/product_list.png" style="width:50px; height:50px;" /&gt;
                    &lt;p style="margin-top:-1px; font-size:12px; color:#64823A;"&gt;Product List&lt;/p&gt;&lt;/b&gt;
                  &lt;/div&gt; 
                &lt;/td&gt;
  
                &lt;td style="width:25%; border-right: 1px solid #A1B588;"&gt;
                  &lt;div (click)="orderList()" style="padding-left:5px; padding-right:5px; margin-bottom:-10px;" &gt;
                    &lt;b&gt;&lt;img src="assets/images/order_list.png" style="width:50px; height:50px;" /&gt;
                    &lt;p style="margin-top:-1px; font-size:12px; color:#64823A;"&gt;Order List&lt;/p&gt;&lt;/b&gt;
                  &lt;/div&gt; 
                &lt;/td&gt;
              &lt;/tr&gt;
            &lt;/table&gt;  
  
            &lt;/ion-slide&gt;
        &lt;/ion-slides&gt;
      &lt;/p&gt;
    &lt;/div&gt;
    &lt;/div&gt;
  
  &lt;/div&gt;    
  
  &lt;ion-nav [root]="rootPage"&gt;&lt;/ion-nav&gt;
  </code></pre>