Pablo Pablo - 8 months ago 91
AngularJS Question

Use underscore inside Angular controllers

How do I use underscore library inside angularjs controllers?

On this post: AngularJS limitTo by last 2 records
somebody suggested to assign an _ variable to the rootScope so that the library will be available to all the scopes within the app.

But I'm not clear where to do it. I mean should it go on the app module declaration? i.e:

var myapp = angular.module('offersApp', [])
.config(['$rootScope', function($rootScope) { }

But then where do I load underscore lib? I just have on my index page the ng-app directive and script reference to both the angular-js and underscore libs?


<body ng-app="offersApp">
<script src="//"></script>
<script src="scripts/vendor/angular.js"></script>
<script src="scripts/vendor/underscore.js"></script>

How do I achieve this?


When you include Underscore, it attaches itself to the window object, and so is available globally.

So you can use it from Angular code as-is.

You can also wrap it up in a service or a factory, if you'd like it to be injected:

var underscore = angular.module('underscore', []);
underscore.factory('_', ['$window', function($window) {
  return $window._; // assumes underscore has already been loaded on the page

And then you can ask for the _ in your app's module:

// Declare it as a dependency of your module
var app = angular.module('app', ['underscore']);

// And then inject it where you need it
app.controller('Ctrl', function($scope, _) {
  // do stuff