Adding a Jquery Plugin to an Angular 2 project

Question

I am trying to add this Jquery plugin to my Angular2 project.

I have added the files to "src/assets" also in index.html I've added <script src="assets/jquery.twentywenty.js"></script> and declare var twentytwenty: any;

I am getting

jquery.twentytwenty.js:152 Uncaught ReferenceError: jQuery is not defined at jquery.twentytwenty.js:152

also

TypeError: Cannot read property 'twentytwenty' of undefined

What am I missing here?

Abbas Amiri · Accepted Answer · 2018-02-13 14:00:17Z

2

I normally apply below steps for using jquery plugins in my projects; maybe helpful.

1 - Adding jquery and plugin files path in angular-cli.json (scripts section).

  "scripts": [
    "../node_modules/jquery/dist/jquery.js",
    "assets/vendor/plugin/jquery.plugin.js"
  ]

2 - Declaring jquery variable in component.

declare let $: any;

3 - Using the plugin syntax.

(<any>$('#theId')).plugin();

answered Feb 13, 2018 at 14:00

Abbas Amiri

3,2241 gold badge27 silver badges25 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Adding a Jquery Plugin to an Angular 2 project

1 Answer 1

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Linked

Related