web-dev-qa-db-fra.com

Utiliser un trait de soulignement dans les contrôleurs Angular

Comment utiliser la bibliothèque de soulignement dans les contrôleurs angularjs?

Sur ce post: AngularJS limitTo des 2 derniers enregistrements quelqu'un a suggéré d'attribuer une variable _ au rootScope afin que la bibliothèque soit disponible pour tous les portées de l'application.

Mais je ne sais pas où le faire. Je veux dire devrait-il aller sur la déclaration du module d'application? c'est à dire:

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

Mais alors où dois-je charger le soulignement lib? J'ai juste sur ma page d'index la directive ng-app et la référence de script aux bibliothèques angular-js et underscore?

index.html:

<head>
</head>
<body ng-app="offersApp">
...
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="scripts/vendor/angular.js"></script>
<script src="scripts/vendor/underscore.js"></script>
...

Comment puis-je y arriver?

javascriptangularjsunderscore.js
125
Pablo

Lorsque vous incluez un trait de soulignement, il s’attache à l’objet window et est donc disponible globalement.

Vous pouvez donc l'utiliser à partir de Angular code tel quel.

Vous pouvez également l'envelopper dans un service ou une usine, si vous souhaitez l'injecter:

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

Et ensuite, vous pouvez demander le _ dans le module de votre application:

// 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
});
230
satchmorun

J'ai implémenté la suggestion de @ satchmorun ici: https://github.com/andresesfm/angular-underscore-module

Pour l'utiliser:

  1. Assurez-vous que vous avez inclus underscore.js dans votre projet.

    <script src="bower_components/underscore/underscore.js">

  2. Tu piges:

    bower install angular-underscore-module

  3. Ajoutez angular-underscore-module.js à votre fichier principal (index.html)

    <script src="bower_components/angular-underscore-module/angular-underscore-module.js"></script>

  4. Ajouter le module en tant que dépendance dans la définition de votre application

    var myapp = angular.module('MyApp', ['underscore'])

  5. Pour l'utiliser, ajoutez une dépendance injectée à votre contrôleur/service et celui-ci est prêt à être utilisé.

    angular.module('MyApp').controller('MyCtrl', function ($scope, _) {
...
//Use underscore
_.each(...);
...
32
unify

J'utilise ceci:

var myapp = angular.module('myApp', [])
  // allow DI for use in controllers, unit tests
  .constant('_', window._)
  // use in views, ng-repeat="x in _.range(3)"
  .run(function ($rootScope) {
     $rootScope._ = window._;
  });

Voir https://github.com/angular/angular.js/wiki/Understanding-Dependency-Injection à peu près à mi-chemin pour plus d'informations sur run.

31
wires

Vous pouvez également consulter ce module pour les

https://github.com/floydsoft/angular-underscore

3
Paul Sheldrake

Si cela ne vous dérange pas d'utiliser lodash, essayez https://github.com/rockabox/ng-lodash , il englobe complètement lodash, il s'agit donc de la seule dépendance et vous n'avez pas besoin de charger une autre des fichiers de script tels que lodash.

Lodash est complètement hors de portée de la fenêtre et n'espère pas avoir été chargé avant votre module.

1
Nick White