Ionic 2 and Typescript - Githubissues

I'm attempting to get this running inside a Ionic v2 app, which uses Typescript and Angular 2. As you can guess, integration so far has been a challenge.

Has anyone tried importing this plugin within Typescript/ng2?

So far, my app/pages/home/home.ts looks like this:

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
//import { Event } from '../../interfaces/event';
import { Network } from 'ionic-native';

// fails hard obviously - not sure where this directory is. 
// Tried relative paths, up 3 directories and over to plugins/ but this didn't work either
import { WifiWizard } from 'com.pylonproducts.wifiwizard';

@Component({
  templateUrl: 'build/pages/home/home.html'
})
export class HomePage {
  public events: any;

  constructor(public navCtrl: NavController) {
    this.events = [];

    console.log(window.plugins)
    console.log('test')

    let disconnectSubscription = Network.onDisconnect().subscribe(() => {
      console.log('network was disconnected :-(');
    });

    let connectSubscription = Network.onConnect().subscribe(() => {
      console.log('network connected!'); 
      // We just got a connection but we need to wait briefly
       // before we determine the connection type.  Might need to wait 
      // prior to doing any api requests as well.
      setTimeout(() => {
        if (Network.connection === 'wifi') {
          console.log('we got a wifi connection, woohoo!');
        }
      }, 3000);
    });
  };

  ssidHandler(s){
    console.log("Current SSID ", s);
  };

  fail(e){
    console.log("Failed ", e);
  };

  getCurrentSSID(){
    //WifiWizard is very undefined down here
    WifiWizard.getCurrentSSID(this.ssidHandler, this.fail);
  };

}

Got it figured out. As many others have mentioned, WifiWizard is available as a global and does not need to be imported.

The WifiWizard class can be faked out by declaring it above the component using it, and it will still be available in the emulator or when running on a mobile device. declare let WifiWizard any;

home.ts:

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { Network } from 'ionic-native';

declare let WifiWizard: any;

@Component({
  templateUrl: 'build/pages/home/home.html'
})
export class HomePage {
  public events: any;

  constructor(public navCtrl: NavController) {
    this.events = [];

    if(typeof WifiWizard !== 'undefined') console.log(WifiWizard)
    else console.warn('WifiWizard not loaded');

  };
}

I plan to create a service that uses WifiWizard when available, and falls back to some mocked methods when it is not available. There are mocked classes available for the Ionic Native plugins, so it probably isn't harmful to build a custom mock for WifiWizard. If anyone wants me to share this, pipe up!

hoerresb / WifiWizard

Ionic 2 and Typescript #94