68

コントローラーをバインドしたAngularアプリケーションの一部があります.Argument
'fn' is not a functionエラーが発生しました.誰かが私のコードを見て、なぜそのエラーが発生したのか説明できますか?

私はとても感謝しています:)

html マークアップ:

<section class="col-lg-12" data-ng-controller="MessageController">
  <fieldset>
    <legend>{{ 'MESSAGES' | translate }}</legend>
  </fieldset>
  <div class="margin-left-15">
    <ul class="list-style-button">
      <li data-ng-repeat="message in MSG">{{ message }}</li>
    </ul>
  </div>
</section>

コントローラ：

(function() {
  'use strict';

  var controllers = angular.module('portal.controllers');

  controllers.controller('MessageController', ['$scope', 'MessageService', '$rootScope', function MessageController($scope, MessageService, $rootScope) {
    $rootScope.MSG = MessageService.getMessages();

    $rootScope.$watch('MSG', function(newValue) {
      $scope.MSG = newValue;
    });
  }]);
}());

サービス：

(function() {

  'use strict';

  var messageServices = angular.module('portal.services');

  messageServices.factory('MessageService', ['MessageData', 'localStorageService', 'UserService'], function(MessageData, localStorageService, UserService) {
    return new MessageService(MessageData, localStorageService, UserService);
  });

  function MessageService(MessageData, localStorageService, UserService) {
    this.messageData = MessageData;
    this.localStorageService = localStorageService;
    this.userService = UserService;
  }

  MessageService.prototype.getMessages = function() {
    var locale = this.userService.getUserinfoLocale();
    var messages = this.localStorageService.get(Constants.key_messages + locale);
    if (messages !== null && messages !== undefined) {
      return JSON.parse(messages);
    } else {
      return this.messageData.query({
        locale: locale
      }, $.proxy(function(data, locale) {
        this.save(Constants.key_messages + locale, JSON.stringify(data));
      }, this));
    }
  };

  MessageService.prototype.save = function(key, value) {
    this.localStorageService.add(key, value);
  };

}());

データ：

(function() {
  'use strict';

  var data = angular.module('portal.data');

  data.factory('MessageData', function($resource) {
    return $resource(Constants.url_messages, {}, {
      query: {
        method: 'GET',
        params: {
          locale: 'locale'
        },
        isArray: true
      }
    });
  });
}());

html ヘッド内の js ファイルの順序:

<script src="js/lib/jquery-1.10.js"></script>
<script src="js/lib/angular.js"></script>
<script src="js/lib/angular-resource.js"></script>
<script src="js/lib/angular-translate.js"></script>
<script src="js/lib/angular-localstorage.js"></script>
<script src="js/lib/jquery-cookies.js"></script>
<script src="js/lib/bootstrap.js"></script>
<script src="js/portal.js"></script>
4

5 に答える 5

162


問題は、以下を使用する代わりに「間違った」構文を使用してサービスを作成することにありました。

messageServices.factory('MessageService', 
    ['MessageData','localStorageService', 'UserService'], 
    function(MessageData, localStorageService, UserService){
        return new MessageService(MessageData, localStorageService, UserService);
    }
);

私は使用しなければなりませんでした：

messageServices.factory('MessageService', 
    ['MessageData','localStorageService', 'UserService', 
    function(MessageData, localStorageService, UserService){
        return new MessageService(MessageData, localStorageService, UserService);
    }
]);

パラメータを使用して配列をすぐに閉じましたが、まだ学習中なので、直接見たことはありませんが、とにかく、これに出くわした他の人を助けることができれば幸いです.

于 2013-09-30T14:02:20.933 に答える
4

上記の回答は、別の原因から発生したアプリケーションで発生した同じ問題を修正するのにかなり役立ちました.

ビルド時に、クライアント アプリが連結されて縮小されるため、関連する問題を回避するために特に Angular を作成しています。config私は自分を次のように定義します

config.$inject = [];
function config() {
    // config stuff
}

(関数を$injectモジュールとして定義し、それが何であるかを宣言します)。

そしてconfig、アプリに他のモジュール (コントローラー、ディレクティブなど) を登録したのと同じように、を登録しようとしました。

angular.module("app").config('config', config); // this is bad!

// for example, this is right
angular.module("app").factory('mainService', mainService);

これは間違っており、前述のエラーが発生しました。だから私はに変更しました

angular.module("app").config(config);

そしてそれはうまくいきました。config角度のある開発者は、単一のインスタンスを持つことを意図していたため、Angularconfigが登録されたときに名前を受け入れないようにしたと思います。

于 2016-09-24T20:37:47.633 に答える
1

私は同じ問題を抱えていました。私の場合、問題は angular-cookies.js ファイルにありました。他の angularjs スクリプトを含むフォルダーにあり、gulp を使用して js ファイルを縮小すると、エラーが発生しました。

簡単な解決策は、angular-cookies.js ファイルを、選択したフォルダーの外の別のフォルダーに配置して、js ファイルを縮小することでした。

于 2016-11-03T20:02:54.853 に答える