CODEWITHSUNDEEP
javascriptangular
amar
amar

Reputation: 493

How to integrate WinBox JS in Angular?

I am playing with a javascript library called WinBoxJS. I know how to use this with plain JS. I am trying to use it in my Angular project. How can I do that?

https://www.npmjs.com/package/winbox

I installed the winbox using npm. I also included the styles and scripts in the angular.json. I acn make it work if I use the JS and CSS files and add some script in index.html. But, I want it to Angular way. Any idea?

Upvotes: 2

Views: 735

Answers (2)

Giuseppe Pennisi
Giuseppe Pennisi

Reputation: 428

If you want, i created a wrapper for winbow which can be used in an angular project: https://www.npmjs.com/package/@rbtechdev/angular-winbox

Upvotes: 0

SiddAjmera
SiddAjmera

Reputation: 39432

DISCLAIMER: The code below works for the current version of winbox i.e. [email protected]

You can use it in Angular by following the steps below:

  1. Install winbox:

    npm i [email protected]

  2. Add winbox CSS to your styles.css/styles.scss:

    @import '~winbox/dist/css/winbox.min.css';

  3. Add the winbox bundle to your angular.json scripts at path - ( projects.projectName.architect.build.options.scripts ):

    "scripts": [
  "node_modules/winbox/dist/winbox.bundle.js"
]

  4. Add a declaration for WinBox to your Component. The line below declares WinBox in app.component.ts:

    declare const WinBox: any;

  5. Use WinBox as per their Documentation here.

Here's a Working Sample StackBlitz for your ref.

Upvotes: 4

Related Questions