ionic2/angular2 - Access an object in an external file in typescript

Question

I am building a mobile app using ionic2. For payments online i use a simple online payment service called Paystack.

it works by including a js file in your webpage and then calling a function

<script>
  function payWithPaystack(){
    var handler = PaystackPop.setup({
      key: 'UNIQUE_KEY_HERE',
      email: '[email protected]',
      amount: 10000,
      ref: "UNIQUE TRANSACTION REFERENCE HERE",
      metadata: {
         custom_fields: [
            {
                display_name: "Mobile Number",
                variable_name: "mobile_number",
                value: "+2348012345678"
            }
         ]
      },
      callback: function(response){
          alert('success. transaction ref is ' + response.reference);
      },
      onClose: function(){
          alert('window closed');
      }
    });
    handler.openIframe();
  }
</script>

I am trying to port this to my ionic app. The problem is that it doesn't recognise PaystackPop even though i included the js file in the index.html.

How can i resolve this? I'm guessing i have to somehow import PaystackPop the way i import other classes, but i have no idea how to go about this. Any advice?

Answer 1

I figured it out. All i had to do was declare PaystackPop at the top of the file.

import { Component } from '@angular/core';
import { NavController, ViewController, ToastController } from 'ionic-angular';

declare var PaystackPop: any;