Globally load Jquery in Angularjs 2 application

Question

I need to have jquery available into all my components of my application so that i can use like this

import jquery; and use the jquery api in all components

I am using SystemJS, Angular 2 and typescript. How can i achieve this ?

Regards

Answer 1

You need to import jquery $ in your application and have to configure your systemjs loader where the jQuery library will be available

    //in your typescript angular2
    import * as $ from 'jQuery';

    // in your systemjs configuration
    //map

    (function(global) {
  // map tells the System loader where to look for things
  var map = {
    'app':                        'app', // 'dist',
    'jQuery':                     'node_modules/jQuery/lib/node-jquery.js',
  };

you can also import it in your html index.html like below

System.import('jQuery').catch(function(err){ console.error(err); });

Adjust your self to make it work