7

アセットを含む Ruby on Rails 3.2.8 プロジェクトで AngularJS を使用しています。

開発マシンで AngularJS を使用しているフォームをロードしても問題はありません。ただし、本番サーバーに同じフォームをロードすると、Javascript コンソールに次のエラーが表示されます。

Error: Unknown provider: aProvider <- a

フォーム内で使用するために AngularJS をセットアップした coffeescript ファイルまで追跡しました。

$ (event) ->
  $("#timesheet_description").autocomplete({source: '/autocomplete/work_descs'})

  # Create AngularJS module
  app = angular.module 'timesheetApp', []

  # Create a AngularJS controller
  app.controller "TimesheetCtrl", ($scope) ->
    $scope.costed_amount = 0
                                                                                                # Bind my module to the global variables so I can use it.
  angular.bootstrap document, ["timesheetApp"]  

これをすべてコメントアウトすると、ページはエラーなしで、AngularJS 機能なしで読み込まれます。

問題は Rails アセットのコンパイルと縮小によるものですか? これを修正して、引き続き coffeescript と Rails アセットを使用する方法はありますか?

4

3 に答える 3

20

AngularJS は、現在使用しているスタイル (プレトタイピングと呼ばれます) を使用する場合、関数の引数名を使用して依存性注入を行います。そうです、ミニフィケーションはこれを完全に破ります。

ただし、修正は簡単です。インジェクションが必要な ('$xxx' を使用している) 変数の場合は常に、次のようにします。

app.controller "TimesheetCtrl", ['$scope', ($scope) ->
  $scope.costed_amount = 0
]

基本的に、すべての関数定義を配列に置き換えます。最後の要素は関数定義自体である必要があり、最初の要素は$names注入するオブジェクトの要素です。

docsには、さらに(十分に明確ではありませんが)情報があります。

于 2012-10-17T09:48:42.960 に答える
6

どこかで配列表記を見逃した場合、これを見つけるには角度コードを少し変更する必要がありますが、非常に迅速な解決策です。

変更はconsole.log("Array Notation is Missing",fn); ( 関数開始から 11 行目)

angular.js(縮小されていない)の注釈機能を見つけます

function annotate(fn) {
      var $inject,
          fnText,
          argDecl,
          last;

      if (typeof fn == 'function') {
        if (!($inject = fn.$inject)) {
          $inject = [];
          if (fn.length) {
console.log("Array Notation is Missing",fn);
fnText = fn.toString().replace(STRIP_COMMENTS, '');
        argDecl = fnText.match(FN_ARGS);
        forEach(argDecl[1].split(FN_ARG_SPLIT), function(arg){
          arg.replace(FN_ARG, function(all, underscore, name){
            $inject.push(name);
          });
        });
      }
      fn.$inject = $inject;
    }
  } else if (isArray(fn)) {
    last = fn.length - 1;
    assertArgFn(fn[last], 'fn');
    $inject = fn.slice(0, last);
  } else {
    assertArgFn(fn, 'fn', true);
  }
  return $inject;
}
于 2014-04-17T10:00:37.943 に答える
0

角度を最小化するには、宣言を「配列」宣言「モード」に変更するだけです。次に例を示します。

から:

var demoApp= angular.module('demoApp', []);
demoApp.controller(function demoCtrl($scope) {
} );

var demoApp= angular.module('demoApp', []);
demoApp.controller(["$scope",function demoCtrl($scope) {
}]);

工場サービスを宣言する方法は?

demoApp.factory('demoFactory', ['$q', '$http', function ($q, $http) {
    return {
          //some object
    };
}]);
于 2014-09-18T15:16:45.347 に答える