Gunakan garis bawah di dalam pengontrol sudut

126

Bagaimana cara menggunakan pustaka garis bawah di dalam pengontrol angularjs?

Pada posting ini: AngularJS limitTo pada 2 record terakhir seseorang menyarankan untuk menetapkan variabel _ ke rootScope sehingga perpustakaan akan tersedia untuk semua cakupan dalam aplikasi.

Tapi saya tidak jelas di mana harus melakukannya. Maksud saya harusnya pergi pada deklarasi modul aplikasi? yaitu:

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

Tapi lalu di mana saya memuat garis bawah lib? Saya hanya punya di halaman indeks saya direktif aplikasi-ng dan referensi skrip untuk kedua sudut-js dan garis bawah libs?

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

Bagaimana saya mencapai ini?

javascript angularjs underscore.js Pablo
sumber

baik apa yang Anda coba dan tidak berhasil?

mpm

Saya tidak tahu harus mulai dari mana. Bagaimana cara menautkan raja mana pun dari file <script> dengan bagian angularjs? (pengontrol, layanan, arahan ... dll). Apakah ada yang membutuhkan ('...') ekspresi seperti?

Pablo

cukup deklarasikan tag skrip yang tepat dengan garis bawah pada file html Anda, seperti yang Anda lakukan dengan sudut atau jquery.

mpm

Apakah akan tersedia secara otomatis di bawah karakter _ ?? Bagaimana??

Pablo

231

Ketika Anda memasukkan Garis Bawah, itu melampirkan dirinya sendiri ke windowobjek, dan tersedia secara global.

Jadi Anda bisa menggunakannya dari kode Angular apa adanya.

Anda juga dapat membungkusnya dalam layanan atau pabrik, jika Anda ingin itu disuntikkan:

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

Dan kemudian Anda dapat meminta di _dalam modul aplikasi Anda:

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

27

Saya tidak mengerti mengapa Anda akan menyuntikkannya ketika sudah ada dalam ruang lingkup global.

Walter Stabosz

36

Mungkin karena alasan yang sama Anda menyuntikkan sesuatu, alih-alih menempatkan semuanya dalam lingkup global. Namun, karena Anda jauh lebih kecil kemungkinannya ingin mengganti pustaka garis bawah Anda selama pengujian daripada beberapa ketergantungan lainnya yang lebih spesifik, dapat dimengerti bahwa itu tampaknya tidak perlu.

fess.

50

itu diperlukan ketika Anda menambahkan 'gunakan ketat' ke file Anda. Karena garis bawah / lodash tidak didefinisikan, ia akan melempar ReferenceError: _ tidak didefinisikan ... Anda harus menyuntikkannya, atau menggunakan window._

Shanimal

23

Ha! Saya ingin melakukan injeksi karena itu keren, terima kasih telah memberi saya alasan sebenarnya, @Simalimal.

Aditya MP

10

Anda mungkin juga ingin menyuntikkan _ demi pengujian. Bagaimana Anda akan membawa ketergantungan garis bawah ke lingkungan test suite

sunwukung

32

Saya telah menerapkan saran @ satchmorun di sini: https://github.com/andresesfm/angular-underscore-module

Untuk menggunakannya:

Pastikan Anda telah memasukkan underscore.js dalam proyek Anda
```
<script src="bower_components/underscore/underscore.js">
```
Mengerti:
```
bower install angular-underscore-module
```

Tambahkan angular-underscore-module.js ke file utama Anda (index.html)

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

Tambahkan modul sebagai ketergantungan dalam definisi Aplikasi Anda
```
var myapp = angular.module('MyApp', ['underscore'])
```
Untuk menggunakannya, tambahkan sebagai ketergantungan yang disuntikkan ke Pengontrol / Layanan Anda dan siap digunakan
```
angular.module('MyApp').controller('MyCtrl', function ($scope, _) {
...
//Use underscore
_.each(...);
...
```

menyatukan
sumber

Tampaknya tidak berfungsi. Saya mendapatkan kesalahan yang tidak terdefinisi:Uncaught ReferenceError: _ is not defined

chovy

Saya menambahkan klarifikasi: Anda harus menyertakan underscore.js. Konektor ini hanya membantu Anda menggunakannya dalam suatu layanan. Lihat jawaban @ satchmorun

satukan

31

Saya menggunakan ini:

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

Lihat https://github.com/angular/angular.js/wiki/Understanding-Dependency-Injection tentang setengah jalan untuk informasi lebih lanjut run.

kabel
sumber

ini terlihat bagus tetapi apakah Anda memiliki contoh? Saya perlu mengubah semua huruf besar ke atas pada karakter pertama hanya menggunakan _.capitalize ()

Nate

2

Saya pikir ini harus berhasil <p>{{ _.capitalize('lalala') }}</p>?

Kabel

1

@LVarayut Saya tidak tahu, mengapa tidak mencobanya? (Saya telah pindah ke ReactJS)

kabel

Silakan gunakan layanan sebagai gantinya. Hindari menambahkan barang ke $ rootScope Anda akan membantu Anda memiliki kinerja yang lebih baik.

Tim Hong

Tidak yakin apa yang saya lakukan salah tetapi saya tidak bisa mendapatkan bagian "penggunaan dalam tampilan" untuk bekerja. Tetapi meneruskan layanan ke controller dan kemudian ke tpl melalui $ ctrl berfungsi.

Olivvv

3

Anda juga dapat melihat modul ini untuk sudut

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

Paul Sheldrake
sumber

bagaimana Anda memuat hal ini dalam sebuah pengontrol?

chovy

3

Saya selalu khawatir tentang modul yang belum diperbarui selama bertahun

Tahir Khalid

1

Jika Anda tidak keberatan menggunakan lodash, coba https://github.com/rockabox/ng-lodash membungkus lodash sepenuhnya sehingga ini adalah satu-satunya ketergantungan dan Anda tidak perlu memuat file skrip lain seperti lodash.

Lodash benar-benar keluar dari lingkup jendela dan tidak ada "berharap" bahwa itu telah dimuat sebelum modul Anda.

Nick White
sumber

-2

Anda dapat menggunakan modul ini -> https://github.com/jiahut/ng.lodash

ini untuk lodashbegitu jugaunderscore

jiahut
sumber

1

dapatkah Anda memberikan instruksi penggunaan

Paul Preibisch

Gunakan garis bawah di dalam pengontrol sudut

Jawaban: