Hide Logo on Subpages


#1

Hey guys. I am trying to figure it out how to hide a logo which is in the top navigation once I click on the sub-page.

toolbar.html


<ion-header align-title="center">
  <ion-navbar>
    <ion-buttons side="left" class="logo-btn">
      <button ion-button icon-only class="logo-icon">
        <img src="assets/logo-icon.svg">
      </button>
</ion-buttons>
</ion-navbar>

any tricks?
Thanks for help


#2

What do you mean by sub-page ? Are you using tabs ?

Can you show us the sub-page html.


#3

Yes, I use tabs.

sub-page.html


<toolbar></toolbar>

<ion-content padding>
  <div class="camp-info-wrapper" style="position: relative;">
    <div class="camp-info">
      <div class="camp-banner">
         <img src="assets/img.png">
      </div>
      <h2>
        {{camp.title}}
      </h2>
      <p  [innerHTML]="camp.description"  class="description" [class.collapsed]="readmore">
      </p>
      <button ion-button full outline class="light-btn" (click) = "readMore()" >
        Read more >
      </button>
      
    </div>
  </div>
</ion-content>

#4

I think the easy way would be to emit an event on page enter/load, subscribe to it in the parent page and show/hide the logo…

There are methods to detect tab change and current tab, but I don’t think the parent page showing the header can access those child elements…above options seems quick to implement.