33

と の宣言の違いを理解したいと思いMyOtherServiceますMyOtherComplexService。特に角括弧部分の目的は何ですか？それらをいつ使用し、いつ使用しないのですか？

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

myapp.factory('MyService', function($rootScope, $timeout) {
    return {
        foo: function() {
            return "MyService";
        }
    }
});

myapp.factory('MyOtherService', function($rootScope, $timeout, MyService) {
    return {
        foo: function() {
            return "MyOtherService";
        }
    }
});

myapp.factory('MyOtherComplexService', ['$rootScope', '$timeout', 'MyService', function($rootScope, $timeout, MyService) {
    return {
        foo: function() {
            return "MyOtherComplexService";
        }
    } 
}]);

myapp.controller('MyController', function($scope, MyOtherService, MyOtherComplexService) {

    $scope.x = MyOtherService.foo();
    $scope.y = MyOtherComplexService.foo(); 
});
4

4 に答える 4

34

これにより、AngularJS コードを縮小できます。AngularJS はパラメーター名を使用して、コントローラー関数に値を挿入します。JavaScript の縮小プロセスでは、これらのパラメーターの名前が短い文字列に変更されます。文字列配列を使用してどのパラメーターが関数に注入されるかを伝えることで、AngularJS はパラメーターの名前が変更されたときに正しい値を注入できます。

于 2013-08-03T11:01:33.773 に答える
6

Ufukの答えに追加するには：

ngmin - 標準モジュールを min-safe モジュールにコンパイルします

Angular の min-safe 角括弧表記は、すべての依存関係を 2 回入力する必要があり、引数の順序が重要であるため、明らかに不便です。標準モジュールを min-safe modules にコンパイルするngminというツールがあるため、それらすべてを手動で管理する必要はありません。

Angular + CoffeeScript

CoffeeScriptを使用している場合、状況はさらに悪化します。ソース マップを破棄する ngmin のいずれかを選択できます。または、自分ですべてを書き出す場合は、コード全体を角かっこで囲む必要があります。これは非常に見苦しいものです。

angular.module('whatever').controller 'MyCtrl', ['$scope', '$http' , ($scope, $http) ->
  # wrapped code
]

私の意見では、これは CoffeeScript の欠陥ではなく、Angular チームの不適切な設計上の決定です。なぜなら、関数を最後の引数として持たないことは、すべての JS/CoffeeScript 規則に反するからです。十分な暴言ですが、これを回避するための小さなヘルパー関数を次に示します。

deps = (deps, fn) ->
  deps.push fn
  deps

これは、2 つの引数を受け取る非常に単純な関数です。1 つ目は依存関係を含む文字列の配列で、2 つ目はモジュールの関数です。次のように使用できます。

angular.module('whatever').controller 'MyCtrl', deps ['$scope', '$http'] , ($scope, $http) ->
  # unwrapped code \o/
于 2013-08-03T14:36:16.323 に答える