Use Jquery library with AngularAMD

Question

Use Jquery library with AngularAMD

Navigation

#1 by (0 votes)
#2 by (0 votes)

8

I'm implementing AngularJS + RequireJs through AngularAMD.

I want to add the Jquery library but it returns the following error when I use "$":

Error: $ is not defined

I have main.js set up as follows:

require.config({
    baseUrl: "js/",

    // alias libraries paths
    paths: {
        'angular': 'libs/angular.min',
        'angular-route': 'libs/angular-route.min',
        'angular-ui-router': 'libs/angular-ui-router.min',
        'angularAMD': 'libs/angularAMD',
        'jquery': '//code.jquery.com/jquery-1.11.2.min.js',
        'jquery-migrate': '//code.jquery.com/jquery-migrate-1.2.1.min.js'
    },

    // Add angular modules that does not support AMD out of the box, put it in a shim
    shim: {
        'angular-route': [ 'angular' ],
        'angularAMD': [ 'angular' ],
        'angular-ui-router': [ 'angular' ]
    },

    // kick start application
    deps: ['app']
});

What's wrong?

javascript angularjs requirejs

asked by anonymous 21.04.2015 / 20:28

2 answers

How to configure the Visual Studio Code to open the console in a new window? Copy of WordPress database without using PHPMyAdmin

score 0 · Answer 1

0

Try to put jquery into shim like this:

shim: {
    "jquery": {
      exports: "jquery"
    }
  }

18.06.2015 / 18:17

score 0 · Answer 2

use angular.element instead of $

angular.element serves as an alias for the jQuery function if it is loaded.

If it is not loaded it will use the jQlite that is docked in the angle.

$('xxx')
angular.element('xxx')

You can read a bit more about the documentation in the link below: link