web-dev-qa-db-ja.com

Angularコントローラー内でアンダースコアを使用します

Angularjsコントローラー内でアンダースコアライブラリを使用するにはどうすればよいですか？

この投稿： AngularJS limitTo by last 2 records 誰かが_変数をrootScopeに割り当てて、ライブラリがアプリ内のすべてのスコープで利用できるようにすることを提案しました。

しかし、私はそれをどこで行うか明確ではありません。アプリモジュールの宣言に含める必要がありますか？すなわち：

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

しかし、その後、アンダースコアlibをどこにロードしますか？私はちょうどインデックスページにng-appディレクティブとangular-jsとアンダースコアライブラリの両方へのスクリプト参照を持っていますか？

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

どうすればこれを達成できますか？

javascriptangularjsunderscore.js
125
Pablo

アンダースコアを含めると、windowオブジェクトに自分自身をアタッチするため、グローバルに利用できます。

したがって、Angularコードからそのまま使用できます。

注入したい場合は、サービスまたはファクトリでラップすることもできます。

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

そして、アプリのモジュールで_を要求できます：

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

ここで@satchmorunの提案を実装しました： https://github.com/andresesfm/angular-underscore-module

使用するには：

  1. プロジェクトにunderscore.jsが含まれていることを確認してください

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

  2. それを得る：

    bower install angular-underscore-module

  3. Angular-underscore-module.jsをメインファイル（index.html）に追加します

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

  4. モジュールをアプリ定義に依存関係として追加します

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

  5. 使用するには、コントローラー/サービスに注入された依存関係として追加し、使用する準備ができました

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

私はこれを使用します：

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

runの詳細については、 https://github.com/angular/angular.js/wiki/Understanding-Dependency-Injection を約半分参照してください。

31
wires

角度については、このモジュールをご覧ください

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

3
Paul Sheldrake

Lodashを使用してもかまわない場合は、 https://github.com/rockabox/ng-lodash lodashを完全にラップするので、これが唯一の依存関係であり、他のロードは不要です。 lodashなどのスクリプトファイル。

Lodashはウィンドウスコープから完全に外れており、モジュールの前にロードされることを「期待」していません。

1
Nick White