title: Angular2 calling custom function after ngSwitch new view is created
body: <p>I am creating a small app using <strong><code>Angular2+Ionic2</code></strong>. In this app I want initialise <code>google-map</code> into <code>view segment</code> when user switch to the <code>map-segment</code> using <strong><code>ion-segment</code></strong></p>
  
  <p>Following is the sample code structure:</p>
  
  <pre><code>&lt;ion-navbar *navbar class="hide-navbar"&gt;
      &lt;ion-segment [(ngModel)]="homeSegment"&gt;
          &lt;ion-segment-button value="list"&gt;
              List..
          &lt;/ion-segment-button&gt;
          &lt;ion-segment-button value="map" &gt;
              Map
          &lt;/ion-segment-button&gt;
      &lt;/ion-segment&gt;
  &lt;/ion-navbar&gt;
  &lt;ion-content&gt;
      &lt;div [ngSwitch]="homeSegment" &gt;
  
          &lt;div *ngSwitchWhen="'map'"&gt;
              &lt;div id="googleMap"&gt;&lt;/div&gt;
          &lt;/div&gt;
  
          &lt;ion-list *ngSwitchWhen="'list'"&gt;
             Listing
          &lt;/ion-list&gt;
      &lt;/div&gt;
  &lt;/ion-content&gt;
  </code></pre>
  
  <p>I have tried by providing <strong><code>click</code></strong> listener for <strong><code>ion-segment-button</code></strong>, but that doesn't worked out. Before <strong><code>div</code></strong> with <strong><code>id="googleMap"</code></strong> is appended to <strong><code>DOM</code></strong>, functionality for adding map gets triggered, and which result a <strong><code>undefined error</code></strong>.</p>
  
  <p>So, how we can understand when new elements are loaded when an <strong><code>ngSwitch</code></strong> happens? Whats the best way to do it?</p>
  
  <h1>update (adding js code)</h1>
  
  <pre><code>import {Page, NavController} from 'ionic-angular';
  import {DataServiceManager} from '../../services/dataServicesManager';
  
  @Page({
    templateUrl: 'build/pages/listFob/listFob.html'
  })
  export class ListFob {
      static get parameters(){
          return [[NavController],[DataServiceManager]];
      }
      onPageWillEnter(){
          this.fetchFobs();
      }
      ngOnInit(){
          console.log("on init");
          console.log(this.homeSegment);
      }
      ngAfterContentChecked() {
          console.log("content checked")
      }
      constructor(nav, dataServiceManager){
          this.nav = nav;
          this.dataServiceManager = dataServiceManager;
          this.homeSegment = "list";
      }
      loadMap(){
          console.log(document.getElementById("googleMapAllFobs"));
          // TODO: load map functionality
      }
  }
  </code></pre>
  
  <h1>Error message coming while adding Directive</h1>
  
  <pre><code>./app/directives/switch-segment.js
  Module build failed: SyntaxError: /Users/Piccaza/ionic-projects/learning/fob/app/directives/switch-segment.js: Unexpected token (8:27)
     6 | })
     7 | export class SwitchSegment {
  &gt;  8 |     @Output() switchSegment: EventEmitter = new EventEmitter();
       |                            ^
     9 |     ngOnInit() {
    10 |         console.log("Directive triggered!");
    11 |         this.onCreate.emit('dummy');
      at Parser.pp.raise (/Users/Piccaza/ionic-projects/learning/fob/node_modules/babylon/index.js:1378:13)
      at Parser.pp.unexpected (/Users/Piccaza/ionic-projects/learning/fob/node_modules/babylon/index.js:2817:8)
      at Parser.pp.expect (/Users/Piccaza/ionic-projects/learning/fob/node_modules/babylon/index.js:2811:33)
      at Parser.pp.parseMethod (/Users/Piccaza/ionic-projects/learning/fob/node_modules/babylon/index.js:1091:8)
      at Parser.pp.parseClassMethod (/Users/Piccaza/ionic-projects/learning/fob/node_modules/babylon/index.js:2495:8)
      at Parser.pp.parseClassBody (/Users/Piccaza/ionic-projects/learning/fob/node_modules/babylon/index.js:2456:10)
      at Parser.pp.parseClass (/Users/Piccaza/ionic-projects/learning/fob/node_modules/babylon/index.js:2339:8)
      at Parser.pp.parseStatement (/Users/Piccaza/ionic-projects/learning/fob/node_modules/babylon/index.js:1813:19)
      at Parser.pp.parseExportDeclaration (/Users/Piccaza/ionic-projects/learning/fob/node_modules/babylon/index.js:2578:15)
      at Parser.pp.parseExport (/Users/Piccaza/ionic-projects/learning/fob/node_modules/babylon/index.js:2566:29)
   @ ./app/pages/listFob/listFob.js 16:21-63 (CLI v2.0.0-beta.19)
  
  Your system information:
  
  Cordova CLI: Not installed
  Ionic Version: 2.0.0-beta.3
  Ionic CLI Version: 2.0.0-beta.19
  Ionic App Lib Version: 2.0.0-beta.9
  ios-deploy version: 1.8.5 
  ios-sim version: 5.0.6 
  OS: Mac OS X El Capitan
  Node Version: v5.3.0
  Xcode version: Xcode 7.2.1 Build version 7C1002 
  </code></pre>