Hoe kan ik lodash laten werken met Angular JS?

Ik probeer lodash te gebruiken bij ng-repeatrichtlijnen, op deze manier:

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

GridControllerzijn:

IndexModule.controller('GridController', function () {
this._ = _
})

Werkt echter niet en dus wordt er niets herhaald. Als ik de richtlijn verander in ng-repeat="i in [1,2,3,4,5]", werkt het.

lodashis al opgenomen via <script>op <header>vóór angular. Hoe kan ik het laten werken?


Antwoord 1, autoriteit 100%

Ik geef er de voorkeur aan ‘_’ globaal en injecteerbaar te introduceren voor tests, zie mijn antwoord op deze vraag
Gebruik underscore in controllers

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._;
  });

Antwoord 2, autoriteit 53%

Ik wilde alleen wat verduidelijking toevoegen aan het antwoord van @beret en @wires. Ze hebben zeker geholpen en snappen het, maar het hele proces op orde krijgen zou iemand kunnen passen. Dit is hoe ik mijn hoekige omgeving met lodash heb opgezet en het heb laten werken met yeoman gulp-hoekig om goed te kunnen dienen

  • bower install lodash --save(Dit voegt toe aan bower en saves aan bower json)

  • wijzig prieel json om lodash te laden voordat angular dat doet. (Dit helpt als je gulp inject gebruikt en het niet handmatig in index.html wilt plaatsen. Plaats het anders in index.html vóór de hoeklink)

  • Maak een nieuwe constante volgens de richting van @wires.

'use strict';
angular.module('stackSample')
  // lodash support
  .constant('_', window._);
  • Injecteer in elke hoekige service, filter of controller zoals je zou doen:
.filter('coffeeFilter', ['_', function(_) {...}]);
  • Om het in een hoekige HTML-weergave te gooien, injecteert u het gewoon in de controller en wijst u er een bereikvariabele aan toe:
.controller('SnesController', function ($scope, _) {
  $scope._ = _;
})

Ik hoop dat dit iemand helpt bij het opzetten van zijn site. 🙂


Antwoord 3, autoriteit 26%

ng-repeatvereist een Angular-expressie, die toegang heeft tot Angular scope-variabelen. Dus in plaats van _toe te wijzen aan this, wijs het toe aan het $scopeobject dat u in de controller injecteert:

IndexModule.controller('GridController', function ($scope) {
  $scope._ = _;
})

Demo


Antwoord 4, autoriteit 2%

Ik weet niet zeker welke versie van Angular u gebruikt. Het lijkt erop dat je gewoon de syntaxis ‘Controller als’ had moeten gebruiken wanneer je ‘this’ gebruikt om toegang te krijgen tot variabelen in de dom.

Hier is de oplossing hiermee en geen scope te gebruiken.
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>

Other episodes