$噴油器：modulerr無法實例化模塊

我是新來的AngularJS和我面對這個異常

angular.js:68 Uncaught Error: [$injector:modulerr] Failed to instantiate module MovieRama due to: Error: [$injector:modulerr] Failed to instantiate module MovieRama.services due to: Error: [$injector:nomod] Module 'MovieRama.services' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.

我的代碼是：

var app = angular.module('MovieRama.services', []); 
app.factory('rtAPIservice', function($http) { 

    var rtAPI = {}; 

    rtAPI.getMovies = function() { 
     return $http({ 
      method: 'JSONP', 
       url: 'http://api.rottentomatoes.com/api/public/v1.0/lists/movies/in_theaters.json?  page_limit=10&page=1&country=us&apikey=XXXXX&callback=JSON_CALLBACK' 
     }); 
    } 

    return rtAPI; 
}); 

app.factory('rtAPIserviceall', function($http) { 
    var rtAPIall = {}; 

    rtAPIall.getMoviesall = function() { 
     return $http({ 
      method: 'JSONP', 
       url: 'http://api.rottentomatoes.com/api/public/v1.0/movies.json',{ 
      params: { 
       page_limit: '10', 
       page:'1', 
       q: $scope.search, 
       apikey: 'XXXX', 
       callback: 'JSON_CALLBACK' 
      } 
     } 
     }) 
    } 
return rtAPIall; 
});

HTML

<!DOCTYPE html> 
<html> 
<head> 
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no" /> 
<link rel="stylesheet" href="/node_modules/angular-material/angular-material.css"> 
<title>MovieRama</title> 
</head> 

<body ng-app="MovieRama"> 

     <table> 
      <thead> 
       <tr><th colspan="4">MovieRama</th></tr> 
      </thead> 


      <tbody ng-if= "search != null" ng-controller="moviesController"> 
      <ul ng-repeat="movie in moviesList"> 

       <td> 

        <img src={{movie.posters.thumbnail}} /> 

        <ul> {{movie.title}}</ul> 
        <ul> Release: {{movie.year}}- Runime: {{movie.runtime}}-Audience rating: {{movie. ratings.audience_score}}</ul> 
        <ul>{{movie.synopsis}}</ul> 

       </td> 
</tr> 

      </tbody> 

      <tbody ng-if="search == null"> 
      <ul ng-repeat="movie in moviesListall" ng-controller="moviesallController"> 

       <td> 
        <img src={{movie.posters.thumbnail}}/> 
        <ul> {{movie.title}}</ul> 
        <ul> Release: {{movie.year}} - Runtime: {{movie.runtime}} - Audience rating:  {{movie.ratings.audience_score}} </ul> 
        <ul> {{movie.synopsis}} </ul> 
       </td> 
      </tr> 
      </tbody> 

     </table> 
     <script src="bower_components/angular/angular.js"></script> 
     <script src="bower_components/angular-route/angular-route.js"></script> 
     <script src="js/app.js"></script> 
     <script src="js/services.js"></script> 
     <script src="js/controllers.js"></script> 
     <script src="/node_modules/angular/angular.js"></script> 
     <script src="/node_modules/angular-aria/angular-aria.js"></script> 
     <script src="/node_modules/angular-animate/angular-animate.js"></script> 
     <script src="/node_modules/angular-material/angular-material.js"></script> 

     </body> 
     </html>

應用。 js

angular.module('MovieRama', [ 
     'MovieRama.controllers', 
     'MovieRama.services' 
     ]);

它適用於一家工廠。問題是什麼？

來源

2016-04-14 Ελένη Μάρκου

你如何在你的html中實例化模塊？ –

@AlexChance我編輯了你的描述 –

只是一個猜測，但你可能想嘗試改變你加載你的js文件的順序。首先加載app.js，並在加載之前嘗試在MovieRama.services上注入依賴項。或者嘗試將所有模塊代碼放在一個文件中以測試是否是問題。 –

將依賴關係MovieRama.services添加到引導應用程序的主模塊（可能爲index.js或app.js，基於您的文件結構）。

同時刪除對<script src="/node_modules/angular/angular.js"></script>的引用，因爲您有兩個角度文件。在您的js文件之前將角度文件移到頂部。

另外，爲什麼有兩種方法作爲不同的服務。你可以有兩種方法的服務，如下所示：

var app = angular.module('MovieRama.services', []); 
app.factory('rtAPIservice', function($http) { 

var rtAPI = {}; 

rtAPI.getMovies = function() { 
    return $http({ 
     method: 'JSONP', 
      url: 'http://api.rottentomatoes.com/api/public/v1.0/lists/movies/in_theaters.json?  page_limit=10&page=1&country=us&apikey=XXXXX&callback=JSON_CALLBACK' 
    }); 
} 
rtAPI.getMoviesall = function() { 
    return $http({ 
     method: 'JSONP', 
      url: 'http://api.rottentomatoes.com/api/public/v1.0/movies.json',{ 
     params: { 
      page_limit: '10', 
      page:'1', 
      q: $scope.search, 
      apikey: 'XXXX', 
      callback: 'JSON_CALLBACK' 
     } 
    } 
    }) 
} 
return rtAPI; 
});

來源

2016-04-14 18:44:17

我想我已經做到了。我已爲您編輯說明 –

我已更新答案 –

沒有任何變化。奇怪的是，當我添加第二個app.factory時出現問題。任何其他想法？ –

$噴油器：modulerr無法實例化模塊

回答

相關問題