title: How to stoPropagation in ion-tab from IONIC 3
body: <p>I have an app with 4 ion-tabs like example below:</p>
  <p><a href="https://i.stack.imgur.com/teaI3.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/teaI3.png" alt="enter image description here" /></a></p>
  <p>I would like that in some cases disable the ion-tab and if user try click in this disabled tabs the application will display a modal message for them.
  As we already know, if we disable an &quot;ion-tab: or a &quot;button&quot; we cannot get the eventLister. So I'm trying to get this click event and stopPropagation() but it`s not working. Could you please help me?</p>
  <p>take a look my code</p>
  <p>#My ion-tabs</p>
  <pre><code>&lt;ion-tabs #myTabs *ngIf=&quot;showTabs&quot;&gt;
     &lt;ion-tab *ngFor=&quot;let tab of tabs&quot; [root]=&quot;tab.root&quot; [tabTitle]=&quot;tab.title&quot; [tabIcon]=&quot;tab.icon&quot;
  (ionSelect)=&quot;selectPage($event)&quot; (ionChange)=selectedTab($event)&gt;&lt;/ion-tab&gt;
  </code></pre>
  
  <p>#in my .ts file I tried this I get all tabs element and put a css style to simulate disabled adding a class ''.isDisabled'</p>
  <pre><code>const tabs = document.querySelectorAll('.tab-button');
  
  for (let i = 1; i &lt; tabs.length; i++) {
     tabs[i].classList.add('isDisabled');
  }
  </code></pre>
  <p>here I'm trying get the tab element in position 1 and get the eventLister</p>
  <pre><code>tabs[1].addEventListener('click', function (e) {
    e.stopPropagation();
    alert('teste');
  });
  </code></pre>
  <p>I can get this eventListener but the e.stopPropagation() is not working.</p>
  <p>any suggestion to help me? thanks. ;)</p>
  <p>$css</p>
  <pre><code>  .isDisabled {
    cursor: not-allowed;
    position: relative;
    opacity: 0.5;
    text-decoration: none;
    //pointer-events: none;
  }
  </code></pre>