Comment faire lodash travailler avec Angular JS?

Je suis en train d'utiliser lodash l'utiliser à ng-repeat directives, de cette façon:

<div ng-controller="GridController" ng-repeat="n in _.range(5)">
    <div>Hello {{n}}</div>
</div>

Être GridController:

IndexModule.controller('GridController', function () {

this._ = _

})

N'est cependant pas de travail et donc, rien n'étant répété. Si je change la directive ng-repeat="i in [1,2,3,4,5]" ça marchera.

lodash est déjà inclus via <script> à <header> avant angular. Comment puis-je le faire fonctionner?

InformationsquelleAutor diegoaguilar | 2014-05-26

109

Je préfère créer des " _ " a l'échelle mondiale, et injectables pour les tests, voir ma réponse à cette question
L'utilisation de soulignement à l'intérieur de contrôleurs
```
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._;
  });
```
- va '_' être disponibles dans d'isoler étendues, trop?
- Je ne comprends pas ... la constante est définie, mais alors le "global" trait de soulignement instance window._ est référencé par le $rootScope? N'est-il pas inutile de la constante? Sur l'autre voie, ne devrait pas explicite $inject de référence, être préférée à l'aide d'un attribut sur la angulaires-sage-global $rootscope?
- N'est-il pas préférable d'utiliser $fenêtre au lieu de la fenêtre?
- oui, probablement, et puis peut-être vous avez besoin pour l'injecter trop
- Yep, c'est ce que j'ai utilisé, j'ai créé un service appelé '_' et injectée dans chaque contrôleur où j'en avais besoin: .factory('_', function($window) { return $window._; // assumes underscore has already been loaded on the page })
- Belle. Exactement ce dont j'avais besoin pour utiliser lodash à l'intérieur d'une ng-modèle.
InformationsquelleAutor wires
58

Je voulais juste ajouter quelques précisions à @béret et @fils de réponse. Ils ont certainement aidé et a obtenu le jist de cela, mais l'obtention de l'ensemble du processus de commande peut convenir à quelqu'un. C'est comment j'ai configuré mon angulaire de l'environnement avec lodash et il a obtenu le travail avec yeoman gulp-angulaire de servir correctement
- bower install lodash --save (Ce qui ajoute à la charmille et sauve à la charmille json)
- modifier bower json avoir lodash charge avant angulaire n'. (Cette aide si vous vous trouvez à l'aide de gulp injecter et ne veulent pas mettre manuellement dans index.html. sinon le mettre dans la index.html avant de l'angle de lien)
- Faire une nouvelle constante par @fils de la direction.
```
'use strict';

angular.module('stackSample')
  //lodash support
  .constant('_', window._);
```
- Injecter dans toute angulaire de service, le filtre ou le contrôleur comme vous le feriez pour tout autre chose:
```
.filter('coffeeFilter', ['_', function(_) {...}]);
```
- De les jeter dans certains angulaire html de la vue juste de l'injecter dans le contrôleur et attribuer une portée variable: la
```
.controller('SnesController', function ($scope, _) {
  $scope._ = _;
})
```
Espère que cela aide quelqu'un de leur site. 🙂
- Certaines l'une est faite que d'un module: github.com/kmc059000/angular-lodash-module Maintenant, vous pouvez bower installer.
- J'ai vu que la suggestion de l'avant et il est certainement une bonne idée, mais je préfère encore le petit "manuelle" de la manière que je l'ai parce que je ne pas avoir à dépendre sur le module responsable de suivre les dernières lodash. Cela dit, je pense qu'il y a quelque étrange cas où la façon dont j'ai proposé ne fonctionne pas et dans ce cas, allez dans le module.
- Révision du code, en gardant en place avec les dernières lodash ne serait pas le problème, puisque c'est la charmille.json jeux de lodash à la dernière version. Mais la définition d'un spécifique lodash version que la dépendance est un problème.
- Je veux juste m'assurer que je suis de faire les choses ici. Dans votre controller exemple, vous, en fait, ne pas injecter lodash, droit? ou ai-je raté quelque chose.
- Vieux, mais de l'or! Je pense que cela devrait être la réponse car il est complet et l'étape-par-étape. A fonctionné assez bien pour moi.
InformationsquelleAutor ThinkBonobo
29

ng-repeat nécessite Angulaire de l'expression, qui a accès à Angulaires de la portée des variables. Ainsi, au lieu attribution _ à this, de l'attribuer à l' $scope objet que vous injectez dans le contrôleur:
```
IndexModule.controller('GridController', function ($scope) {
  $scope._ = _;
})
```
Démo
- Donc, la bonne pratique est de toujours include $scope
- Assez bien, oui, sauf si vous prévoyez sur l'utilisation de la controller as la syntaxe.
- toujours utiliser controler as syntaxe
InformationsquelleAutor Marc Kline
2

Je ne suis pas certain de la version Angulaire que vous utilisez. On dirait que vous devriez ai juste utilisé le 'Contrôleur' la syntaxe lorsque vous utilisez 'ce' pour accéder à des variables dans les dom.

Voici la solution avec ce et n'utilisant pas de portée.
http://plnkr.co/edit/9IybWRrBhlgQAOdAc6fs?p=info
```
 <body ng-app="myApp" ng-controller="GridController as grid">
      <div ng-repeat="n in grid._.range(5)">
      <div>Hello {{n}}</div>
    </div>
  </body>
```
InformationsquelleAutor magizh

Vous devez vous connecter pour publier un commentaire.