web-dev-qa-db-ja.com

Angularjsエラー不明なプロバイダー

構成された値authorversion in angular valueサービスをHTMLページで表示しようとしています。 htmlコードです

    <!doctype html>
<html lang="en" ng-app="myApp">
<head>
  <meta charset="utf-8">
  <title>My AngularJS App</title>
  <link rel="stylesheet" href="css/app.css"/>
</head>
<body>
  <ul class="menu">
    <li><a href="#/view1">view1</a></li>
    <li><a href="#/view2">view2</a></li>
  </ul>

  <div ng-view></div>

  <div>Angular seed app: v<span app-version></span></div>
  <div>Author is : <span app-author></span></div>


  <script src="lib/angular/angular.js"></script>
  <script src="js/app.js"></script>
  <script src="js/services.js"></script>
  <script src="js/controllers.js"></script>
  <script src="js/filters.js"></script>
  <script src="js/directives.js"></script>
</body>
</html>

これがディレクティブです...

angular.module('myApp.directives', []).
  directive('appVersion', ['version', function(version) {
    return function(scope, Elm, attrs) {
      Elm.text(version);
    };
  }])
  .directive('appAuthor', ['author', function(author) {
    return function(scope, Elm, attrs){
        Elm.text(author);
    };
  }]);

そして、これはauthorversionの値が設定されているサービス部分です

    angular.module('myApp.services', []).
  value('version', '0.1')
  .value('author','JIM');

開発者コンソールで取得しているエラーは

Error: Unknown provider: authorProvider <- author <- appAuthorDirective
32
agasthyan

これらのモジュール(myApp.servicesおよびmyApp.directives)をメインアプリモジュールの依存関係として、このようにロードしていることを確認してください。 :

angular.module('myApp', ['myApp.directives', 'myApp.services']);

plunker:http://plnkr.co/edit/wxuFx6qOMfbuwPq1HqeM?p=preview

49
bmleite

bmleiteには、モジュールを含めることについての正しい答えがあります。

それがあなたの状況で正しい場合は、複数のファイルでモジュールを再定義していないことも確認する必要があります。

覚えておいてください:

angular.module('ModuleName', [])   // creates a module.

angular.module('ModuleName')       // gets you a pre-existing module.

したがって、既存のモジュールを拡張する場合、それを取得しようとするときに上書きしないようにしてください。

31
Jukka Dahlbom