Foloosi
  • INTRODUCTION
  • FEATURES
  • Get Started
    • Create Api Credentials
    • Checkout Page Customization
  • Payment Methods
    • Popup Payment Method
    • Hosting Payment Method
    • Saved Card Payment Method
  • CLIENT SIDE INTEGRATIONS
    • Javascript Integration
      • Create Payment Token
      • Payment Widget Initialization
      • Payment Response Handling
      • Additional Setup
      • Sample Integrations
    • PHP Integration
      • Create Payment Token
      • Payment Widget Initialization
      • Payment Response Handling
      • Additional Setup
      • Sample integrations
    • React JS Integration
      • Create payment Token
      • Payment Widget Initialization
      • Payment Response Handling
      • Additional Setup
    • Angular JS Integration
      • Create payment Token
      • Payment Widget Initialization
      • Payment Response Handling
      • Additional Setup
  • ECOMMERCE INTEGRATIONS
    • WooCommerce
    • CS Cart
    • Ecwid
    • Opencart
    • Magento
    • Prestashop
  • MOBILE SDK INTEGRATIONS
    • Android SDK
      • Initiate Payment
      • Payment Response Handling
    • iOS SDK
      • Initiate Payment
      • Payment Response Handling
    • React Native SDK
      • Make Payment
    • Flutter SDK
      • Installation
      • Make Payment
      • Sample Dart Program
  • SUBSCRIPTIONS
    • Foloosi Subscription for WooCommerce
    • Api Subscription
      • Sample Integration
    • Subscription
  • WEBHOOKS
  • PARTNER PAYOUT
  • CARD DETAILS
    • Test Cards
Powered by GitBook
On this page
  • foloosi-angular
  • Install
  • Initialize Payment Widget
  • For Popup Payment
  • For Hosting Method
  • Support
  • Developed by
  • License

Was this helpful?

  1. CLIENT SIDE INTEGRATIONS
  2. Angular JS Integration

Payment Widget Initialization

Payment is always handled on foloosi's payment screen !

foloosi-angular

Install

npm install --save foloosi-angular

Initialize Payment Widget

Step 1

Add the script below in angular-cli.json.

  "scripts": [
    "./node_modules/foloosi-angular/index.js"
  ]

Step 2

Follow these instructions in your Typescript file to initialize Foloosi Payment.

//To Declare the Foloosi Payment

declare var Foloosipay: any;

// For Success and Error Handlers. You can get the Payment status in the below function, it may be success or error. 

const foloosiHandler = ( function (e) {
  if (e.data.status == 'success') {
    console.log(e.data.status);
    console.log(e.data);
  }
  if (e.data.status == 'error') {
    console.log(e.data.status);
    console.log(e.data);
  }
});

window.addEventListener('message', foloosiHandler);

//To Initialize the Foloosi Payment

constructor(){
    Foloosipay.init();
}

For Popup Payment

If you want to enable payment in <iframe> which only supports Credit/Debit cards, you need not pass the REDIRECT parameter.

Foloosipay.open('REFERENCE_TOKEN','MERCHANT_KEY');

For Hosting Method

If you want to enable hosting payment which supports ApplePay and SamsungPay, you need to pass REDIRECT as true.

Foloosipay.open('REFERENCE_TOKEN','MERCHANT_KEY','REDIRECT');

To Close the Foloosi Payment Popup Use,

Foloosipay.close();

Note - It is mandatory to set REDIRECT to true

  • Add the additional field shown below in the post data of initialize Api

  • // additional Post Data
    site_return_url : "", //your site return url for get the payment response object
  • Add the additional field shown below in the post data of initialize Api

// additional Post Data
customer_unique_identifier : "Unique value",/** MANDATORY FIELD -Customer Unique Reference value should be email/mobile no/uniqueCustomer id from your DB*/

Support

Developed by

Foloosi Technologies Pvt Ltd.

License

Copyrights (c) 2025 Foloosi

PreviousCreate payment TokenNextPayment Response Handling

Last updated 1 month ago

Was this helpful?

Steps to activate Hosting Payment Method (optional) -

Steps to Activate saved card payment (optional) -

Visit for support requests or email to [email protected].

click here for details
click here for details
https://www.foloosi.com