html5 - hide header and ion-slide from login page globally -
i need help. working on ionic2. applied header , ion-slide globally writing coding in app.ts shown in code. issue header , ion-slide displayed in login page(i.e. userloginpage.html) also, trying hide using *ngif shown in app.html , value(i.e. hidelogin) of *ngif set in app.ts in condition if login page 'hidelogin' false ion-slide , header not display not working.
thank you!
any highly appreciated.
here app.ts
import { component, viewchild } '@angular/core'; import { platform } 'ionic-angular'; import { statusbar } '@ionic-native/status-bar'; import { splashscreen } '@ionic-native/splash-screen'; import { walkthroughpage } '../pages/walkthrough/walkthrough'; import { loginpage } '../pages/login/login'; import { userloginpage } '../pages/userlogin/userlogin'; import { networkconnectionpage } '../pages/networkconnection/networkconnection'; import { geolocation } '@ionic-native/geolocation'; import { injectable } '@angular/core'; import { http } '@angular/http'; import 'rxjs'; import { observable } 'rxjs/observable'; import { alertcontroller } 'ionic-angular'; import { toastcontroller } 'ionic-angular'; import { network } '@ionic-native/network'; import { customerlistpage } '../pages/customerlist/customerlist'; import { productpage } '../pages/product/product'; import { customerpage } '../pages/customer/customer'; import { profilepage } '../pages/profile/profile'; import { walletpage } '../pages/wallet/wallet'; import { mydaypage } '../pages/myday/myday'; import { faqpage } '../pages/faq/faq'; import { targetpage } '../pages/target/target'; import { knowledgebasepage } '../pages/knowledgebase/knowledgebase'; import { supportpage } '../pages/support/support'; import { orderlistpage } '../pages/orderlist/orderlist'; import { homepage } '../pages/home/home'; import { app } 'ionic-angular'; import { storage } '@ionic/storage'; //import { navcontroller } '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(() => { statusbar.styledefault(); if (splashscreen) { settimeout(() => { splashscreen.hide(); }, 100); } }); if(userloginpage){ this.hidelogin = false; \\not working } } 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(){} } here app.html
<ion-header *ngif="hidelogin" style="height:55px; background:#63813d" > <!--not working--> <div style="float:left; margin-top:14px; font-size:26px; padding-left:20px; color:#ffffff;"> <!-- <span><ion-icon name="menu"></ion-icon></span> --> <img src="assets/images/app_tray.png" style="width:20px; height:15px; margin-bottom:5px;"> <img src="assets/images/mixbag_logo.png" style="width:100px; height:25px; " (click)="gotohome()"> </div> <div style="float:right; margin-right:15px; margin-bottom:49px; margin-top:10px;" (click) = "signout()"> <div style="float:right; font-size:25px; color:#fff; margin-top:2px;"><b><img src="assets/images/sign_out.png" style="width:30px; height:30px;"></b></div> </div> <div style="float:right; margin-right:15px; margin-bottom:49px; margin-top:7px;" (click) = "profile()"> <div style="float:left; margin-top:5px;"><img src="assets/images/profileuser.jpg" style="width:30px; height:30px; "></div> </div> </ion-header> <div *ngif="hidelogin" overflow-scroll="false" style="margin-top:48px; background:#fff;" > <!--not working--> <div style="background:#fff; padding-bottom:3px; padding-top:10px;"> <div> <p class="pslider"> <ion-slides autoplay="" speed="50000"> <ion-slide> <table width="100%" border="0"> <tr> <td style="width:25%; border-right: 1px solid #a1b588;"> <div (click)="customerlist()" style="padding-left:5px; padding-right:5px; margin-bottom:-10px;" > <b><img src="assets/images/customer_list.png" style="width:50px; height:50px;" /> <p style="margin-top:-1px; font-size:12px; color:#64823a;">customer list</p></b> </div> </td> <td style="width:25%; border-right: 1px solid #a1b588;"> <div (click)="customerform()" style="padding-left:5px; padding-right:5px; margin-bottom:-10px;" > <b><img src="assets/images/add_customer.png" style="width:50px; height:50px;" /> <p style="margin-top:-1px; font-size:12px; color:#64823a;">add customer</p></b> </div> </td> <td style="width:25%; border-right: 1px solid #a1b588;"> <div (click)="productlist()" style="padding-left:5px; padding-right:5px; margin-bottom:-10px; " > <b><img src="assets/images/product_list.png" style="width:50px; height:50px;" /> <p style="margin-top:-1px; font-size:12px; color:#64823a;">product list</p></b> </div> </td> <td style="width:25%; border-right: 1px solid #a1b588;"> <div (click)="orderlist()" style="padding-left:5px; padding-right:5px; margin-bottom:-10px;" > <b><img src="assets/images/order_list.png" style="width:50px; height:50px;" /> <p style="margin-top:-1px; font-size:12px; color:#64823a;">order list</p></b> </div> </td> </tr> </table> </ion-slide> </ion-slides> </p> </div> </div> </div> <ion-nav [root]="rootpage"></ion-nav>
Comments
Post a Comment