2016-11-20 112 views
0

我試圖將一個名爲recipesApp.recipeData的工廠注入到我的MainController中,一旦我添加它,應用程序崩潰並且我一直收到以下錯誤:

angular.js:68 Uncaught Error: [$injector:modulerr] Failed to instantiate module recipesApp due to: 
Error: [$injector:modulerr] Failed to instantiate module recipesApp.recipeData due to: 
Error: [$injector:nomod] Module 'recipesApp.recipeData' 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('recipesApp', ['ngRoute', 'recipesApp.recipeData']);

我的控制器:

app.controller('MainController', ['$scope', '$http', '$location', '$rootScope', 'recipeData', 
    function($scope,$http,$location,$rootScope,recipeData) {...}]); 

我的食譜廠:

angular 
.module('recipesApp.recipeData', []) 
.factory('recipeData', function($http) { 
    return { 
     getAllRecipes: function(){ 
     $http.get('/allrecipes'); 
     } 
    };  
}); 

我試圖改變的文件結構,文件命名約定。我試着簡單地將它連接到控制器本身的同一個文件中,我已經改變了它被注入的順序,並且我已經三次檢查了拼寫。任何建議都會非常有幫助!

+0

你混淆模塊和服務。沒有名爲$ http的模塊。 $ http是一項服務。模塊依賴於其他模塊,而不是服務。而且你還沒有發佈crusial信息:你的html文件,它必須爲你的應用程序的所有JS文件都有一個腳本標記。 –

+0

哦,我的話,我知道它必須是一個愚蠢的錯誤。忘記在我的html文件中包含腳本標籤。另外,http實際上並不在我的代碼中。我只是打字太快。我應該複製並粘貼。謝謝! – aadams22

+0

@ aadams22如果我的答案幫助解決了您的問題,您可以隨時將其標記爲已接受 –

回答

0

您正在嘗試將$http作爲模塊依賴項添加,$http是服務,而不是模塊。從recipesApp.recipeData模塊依賴

angular 
.module('recipesApp.recipeData', []) 
.factory('recipeData', function($http) { 
    return { 
     getAllRecipes: function(){ 
     $http.get('/allrecipes'); 
     } 
    };  
}); 

刪除它還要確保所有.js文件存在於您的index.html

相關問題