Użyj podkreślenia w kontrolerach Angular

126

Jak używać biblioteki podkreślenia w kontrolerach angularjs?

W tym poście: AngularJS limitTo przez ostatnie 2 rekordy ktoś zasugerował przypisanie zmiennej _ do rootScope, aby biblioteka była dostępna dla wszystkich zakresów w aplikacji.

Ale nie wiem, gdzie to zrobić. Chodzi mi o to, czy powinno to iść na deklarację modułu aplikacji? to znaczy:

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

Ale gdzie w takim razie załadować underscore lib? Po prostu mam na mojej stronie indeksu dyrektywę ng-app i odwołanie do skryptu do bibliotek angular-js i 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>
...

Jak to osiągnąć?

javascript angularjs underscore.js Pablo
źródło

dobrze, co próbowałeś i nie zadziałało?

mpm

Cóż, nie wiem, od czego zacząć. Jak powiązać dowolny typ plików <script> z częścią angularjs? (administratorzy, usługi, dyrektywy ... itd.). Czy jest jakieś wyrażenie typu require ('...')?

Pablo

po prostu zadeklaruj odpowiedni znacznik skryptu z podkreśleniem w pliku html, tak jak w przypadku angular lub jquery.

mpm

Czy będzie dostępny automatycznie pod znakiem _ ?? W jaki sposób??

Pablo,

231

Kiedy włączysz podkreślenie, przyczepia się do windowobiektu, więc jest dostępna globalnie.

Możesz więc używać go z kodu Angular w takiej postaci, w jakiej jest.

Możesz również zapakować go w usługę lub fabrykę, jeśli chcesz, aby został wstrzyknięty:

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

Następnie możesz poprosić o _moduł w swojej aplikacji:

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

satchmorun
źródło

27

Nie rozumiem, dlaczego miałbyś go wstrzyknąć, skoro jest już w globalnym zakresie okna.

Walter Stabosz,

36

Prawdopodobnie z tych samych powodów, dla których wprowadzasz cokolwiek, zamiast umieszczać wszystko w zasięgu globalnym. Jednakże, ponieważ jest dużo mniej prawdopodobne, że będziesz chciał zastąpić swoją bibliotekę podkreśleń podczas testowania niż inne, bardziej szczegółowe zależności, zrozumiałe jest, że nie wydaje się to konieczne.

fess.

50

jest to konieczne, gdy dodasz do pliku słowo „użyj ścisłego”. Ponieważ podkreślenie / lodash nie jest zdefiniowane, spowoduje to zgłoszenie błędu ReferenceError: _ nie jest zdefiniowane ... musisz go wstrzyknąć lub użyć okna._

Shanimal

23

Ha! Chciałem zrobić zastrzyk, ponieważ jest fajny, dzięki za podanie mi prawdziwego powodu, @Shanimal.

Aditya MP

10

możesz także chcieć wstrzyknąć _ w celu przetestowania. Jak

zabrałbyś

32

Wdrożyłem sugestię @ satchmorun tutaj: https://github.com/andresesfm/angular-underscore-module

Aby z niego skorzystać:

Upewnij się, że w swoim projekcie umieściłeś podkreślenie.js
```
<script src="bower_components/underscore/underscore.js">
```
Zdobyć:
```
bower install angular-underscore-module
```

Dodaj angular-underscore-module.js do swojego głównego pliku (index.html)

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

Dodaj moduł jako zależność w definicji aplikacji

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

Aby użyć, dodaj jako wstrzykniętą zależność do kontrolera / usługi i jest gotowa do użycia

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

ujednolicić
źródło

Wydaje się, że nie działa. Otrzymuję nieokreślony błąd:Uncaught ReferenceError: _ is not defined

chovy

Dodałem wyjaśnienie: musisz dołączyć podkreślenie.js. To złącze pomaga tylko w używaniu go w usłudze. Zobacz odpowiedź @ satchmorun

ujednolicić

31

Używam tego:

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

Więcej informacji na ten temat można znaleźć na https://github.com/angular/angular.js/wiki/Understanding-Dependency-Injectionrun .

przewody
źródło

to wygląda dobrze, ale czy masz przykład? Muszę zmienić wszystkie wielkie litery na wielkie na pierwszym znaku tylko za pomocą _.capitalize ()

Nate

2

Myślę, że to powinno działać <p>{{ _.capitalize('lalala') }}</p>?

przewody

1

@LVarayut Nie wiem, dlaczego nie spróbować? (Mam od przeniósł się do ReactJS)

przewody

Zamiast tego skorzystaj z usługi. Unikaj dodawania rzeczy do $ rootScope pomoże ci uzyskać lepszą wydajność.

Tim Hong

Nie jestem pewien, co zrobiłem źle, ale nie udało mi się uruchomić części dotyczącej używania w widokach. Ale przekazanie usługi do kontrolera, a następnie do tpl przez $ ctrl działa.

Olivvv

3

Możesz również przyjrzeć się temu modułowi pod kątem kątów

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

Paul Sheldrake
źródło

jak ładujesz to do kontrolera?

chovy

3

Zawsze martwię się o moduły, które nie były aktualizowane od lat

Tahir Khalid

1

Jeśli nie masz nic przeciwko używaniu lodash, wypróbuj https://github.com/rockabox/ng-lodash , całkowicie otacza lodash, więc jest to jedyna zależność i nie musisz ładować żadnych innych plików skryptów, takich jak lodash.

Lodash jest całkowicie poza zasięgiem okna i nie ma nadziei, że został załadowany przed Twoim modułem.

Nick White
źródło

-2

możesz użyć tego modułu -> https://github.com/jiahut/ng.lodash

to jest dla lodashtak robiunderscore

jiahut
źródło

1

czy możesz podać instrukcje użytkowania

Paul Preibisch,

Użyj podkreślenia w kontrolerach Angular

Odpowiedzi: