Açısal denetleyicilerde alt çizgi kullanın

126

Angularjs denetleyicileri içinde alt çizgi kitaplığını nasıl kullanırım?

Bu gönderide : AngularJS limitTo son 2 kayıttan birine, birisinin rootScope'a bir _ değişkeni atamasını önerdi, böylece kitaplık uygulama içindeki tüm kapsamlar için kullanılabilir olacaktır.

Ama nerede yapacağımı bilmiyorum. Demek istediğim, uygulama modülü bildirimine girmeli mi? yani:

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

Ama sonra alt çizgi lib'yi nereye yüklerim? Sadece indeks sayfamda ng-app yönergesi ve hem açısal-js hem de alt çizgi lib'lerine referans var mı?

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>
...

Bunu nasıl başarırım?

javascript angularjs underscore.js

— Pablo
kaynak

peki ne denedin ve işe yaramadı?

— mpm

Peki, nereden başlayacağımı bilmiyorum. <script> dosyalarının herhangi bir kralı ile angularjs kısmı arasında nasıl bağlantı kurabilirim? (denetleyiciler, hizmetler, yönergeler ... vb.) İfade gibi ('...') herhangi bir gereklilik var mı?

— Pablo

html dosyanızda, angular veya jquery'de yaptığınız gibi, alt çizgi ile uygun betik etiketini beyan edin.

— mpm

_ Karakterinin altında otomatik olarak kullanılabilecek mi? Nasıl??

— Pablo

231

Alt Çizgi'yi dahil ettiğinizde, kendisini windownesneye bağlar ve böylece genel olarak kullanılabilir.

Yani onu Angular kodundan olduğu gibi kullanabilirsiniz.

Enjekte edilmesini istiyorsanız, bir servise veya fabrikaya da sarabilirsiniz:

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

Ve sonra _uygulamanızın modülünde isteyebilirsiniz :

// 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
kaynak

27

Zaten global pencere kapsamındayken neden enjekte edeceğinizi anlamıyorum.

— Walter Stabosz

36

Muhtemelen her şeyi küresel kapsam içine koymak yerine, bir şey enjekte ettiğinizle aynı nedenlerle. Bununla birlikte, test sırasında altçizgi kitaplığınızı değiştirmek istemeniz, daha özel bir bağımlılıktan çok daha az olası olduğundan, gerekli görünmemesi anlaşılabilir bir durumdur.

— fess.

50

dosyanıza 'katı kullanım' eklediğinizde bu gereklidir. Alt çizgi / lodash tanımlanmadığından ReferenceError atacak: _ tanımlı değil ... onu enjekte etmeniz veya pencereyi kullanmanız gerekir._

— Shanimal

23

Ha! Enjeksiyonu yapmak istedim çünkü harika, bana gerçek bir sebep verdiğin için teşekkürler @Shanimal.

— Aditya MP

10

ayrıca test uğruna _ enjekte etmek isteyebilirsiniz.

— Alt

32

@ Satchmorun'un önerisini burada uyguladım: https://github.com/andresesfm/angular-underscore-module

Kullanmak için:

Projenize undercore.js eklediğinizden emin olun

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

Anla:
```
bower install angular-underscore-module
```

Angular-undercore-module.js'yi ana dosyanıza ekleyin (index.html)

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

Modülü Uygulama tanımınıza bağımlılık olarak ekleyin
```
var myapp = angular.module('MyApp', ['underscore'])
```
Kullanmak için, Denetleyicinize / Hizmetinize enjekte edilen bir bağımlılık olarak ekleyin ve kullanıma hazırdır
```
angular.module('MyApp').controller('MyCtrl', function ($scope, _) {
...
//Use underscore
_.each(...);
...
```

— birleştirmek
kaynak

Çalışıyor gibi görünmüyor. Tanımlanmamış bir hata alıyorum:Uncaught ReferenceError: _ is not defined

— chovy

Açıklamayı ekledim: undercore.js eklemeniz gerekiyor. Bu bağlayıcı yalnızca onu bir hizmette kullanmanıza yardımcı olur. Satchmorun cevabı @ bakın

— Birleştir'me

31

Bunu kullanıyorum:

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

Daha fazla bilgi için https://github.com/angular/angular.js/wiki/Understanding-Dependency-Injection hakkında daha fazla bilgi için yarı yolda bakın run.

— teller
kaynak

bu iyi görünüyor ama bir örneğiniz var mı? İlk karakterde yalnızca _.capitalize () kullanarak tüm büyük harfleri büyük olarak değiştirmem gerekiyor

— Nate

2

Bunun işe yarayacağını düşünüyorum <p>{{ _.capitalize('lalala') }}</p>?

— teller

1

@LVarayut bilmiyorum, neden denemiyorsun? (O zamandan beri ReactJS'ye taşındım)

— teller

Lütfen bunun yerine hizmeti kullanın. $ RootScope'unuza bir şeyler eklemekten kaçının, daha iyi performans elde etmenize yardımcı olacaktır.

— Tim Hong

Neyi yanlış yaptığımdan emin değilim ama "görünümlerde kullanım" kısmını işe alamadım. Ancak hizmeti denetleyiciye ve ardından tpl'ye $ ctrl aracılığıyla geçirmek işe yarar.

— Olivvv

3

Açısallar için bu modüle de göz atabilirsiniz.

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

— Paul Sheldrake
kaynak

bu şeyi bir denetleyiciye nasıl yüklersiniz?

— chovy

3

Yıllardır güncellenmeyen modüller hakkında her zaman endişeleniyorum

— Tahir Khalid

1

Eğer lodash kullanmaktan çekinmiyorsanız, https://github.com/rockabox/ng-lodash'ı deneyin, lodash'ı tamamen sarar, böylece tek bağımlılıktır ve lodash gibi başka herhangi bir komut dosyası yüklemenize gerek kalmaz.

Lodash tamamen pencere kapsamının dışındadır ve modülünüzden önce yüklenmesi "umulmamaktadır".

— Nick White
kaynak

-2

bu modülü kullanabilirsiniz -> https://github.com/jiahut/ng.lodash

bu da lodashöyleunderscore

— jiahut
kaynak

1

lütfen kullanım talimatlarını sağlar mısınız

— Paul Preibisch