#javascript #angularjs
#javascript #angularjs
Вопрос:
Я пытаюсь внедрить две фабрики, и мой код выдает ошибку «Ошибка: [$injector: unpr] Неизвестный поставщик: dataserviceProvider:
<!DOCTYPE html>
<html ng-app="MyApp">......
Это html-страница:
@section scripts
{
<script type="text/javascript" src="~/App/Controllers/HomeController.js"></script>
<script src="~/App/Factories/dataservice.js"></script>
<script src="~/App/Factories/quizMetrics.js"></script>
<script src="~/App/Controllers/list.js"></script>
<script src="~/App/Controllers/quiz.js"></script>
<script src="~/App/Controllers/results.js"></script>
}
<div ng-controller="HomeController as ctrl" class="md-content" ng-cloak>.... </div>
И я пытаюсь внедрить сюда, и если я удалю quizMetrics, DataService все работает нормально:
(function () {
angular.module('MyApp', ['ngMaterial', 'ngMessages'])
.controller('HomeController', HomeController);
HomeController.$inject = ['$scope', '$http', '$filter', '$mdDialog', '$timeout', 'quiz','list','result','quizMetrics', 'dataservice' ];
function HomeController($scope, $http, $filter, $mdDialog, $timeout, quiz,list,result,quizMetrics, dataservice ) {
})();
И один из моих сценариев:
(function(){
angular.module("MyApp")
.factory("quizMetrics", QuizMetrics);
QuizMetrics.$inject = ['DataService'];
function QuizMetrics(DataService){
var quizObj = {
quizActive: false,
resultsActive: false,
changeState: changeState, // changeState is a named function below
correctAnswers: [],
markQuiz: markQuiz, // markQuiz is a named function below
numCorrect: 0
};
return quizObj;
function changeState(metric, state){
if(metric === "quiz"){
quizObj.quizActive = state;
}else if(metric === "results"){
quizObj.resultsActive = state;
}else{
return false;
}
}
function markQuiz(){
quizObj.correctAnswers = DataService.correctAnswers;
for(var i = 0; i < DataService.quizQuestions.length; i ){
if(DataService.quizQuestions[i].selected === DataService.correctAnswers[i]){
DataService.quizQuestions[i].correct = true;
quizObj.numCorrect ;
}else{
DataService.quizQuestions[i].correct = false;
}
}
}
}
})();
и dataservice.js
(function(){
angular
.module("MyApp")
.factory("DataService", DataService);
function DataService(){
var dataObj = {
quizQuestions: quizQuestions,
correctAnswers: correctAnswers
};
return dataObj;
}
var correctAnswers = [1, 2, 3, 0, 1, 0, 4, 2, 0, 3];
var quizQuestions = [
{
type: "text",
text: "How much can a loggerhead weigh?",
possibilities: [
{
answer: "Up to 20kg"
},
{
answer: "Up to 115kg"
},
{
answer: "Up to 220kg"
},
{
answer: "Up to 500kg"
}
],
selected: null,
correct: null
},
{
type: "text",
text: "What is the typical lifespan of a Green Sea Turtle?",
possibilities: [
{
answer: "150 years"
},
{
answer: "10 years"
},
{
answer: "80 years"
},
{
answer: "40 years"
}
],
selected: null,
correct: null
},
{
type: "text",
text: "My Question?",
possibilities: [
{
answer: "Answer1"
},
{
answer: "Answer2 Answer2 Answer2 Answer2 Answer2 Answer2 Answer2 Answer2 Answer2 Answer2 Answer2 Answer2 Answer2 Answer2 Answer2 Answer2 Answer2 Answer2 Answer2 Answer2 Answer2 Answer2 Answer2 Answer2 Answer2 Answer2 Answer2 Answer2 Answer2 Answer2 Answer2 Answer2 "
},
{
answer: "Answer3"
},
{
answer: "Answer4"
}
],
selected: null,
correct: null
},
{
type: "text",
text: "How much can a loggerhead weigh?",
possibilities: [
{
answer: "Up to 20kg"
},
{
answer: "Up to 115kg"
},
{
answer: "Up to 220kg"
},
{
answer: "Up to 500kg"
}
],
selected: null,
correct: null
},
{
type: "text",
text: "This is an Yes/No question?'",
possibilities: [
{
answer: "Yes"
},
{
answer: "No"
}
],
selected: null,
correct: null
},
{
type: "text",
text: "This is five answer choices question ?",
possibilities: [
{
answer: "Loggerhead turtle"
},
{
answer: "Leatherback turtle"
},
{
answer: "Hawksbill Turtle"
},
{
answer: "Alligator Snapping Turtle"
}
,
{
answer: "Answer five"
}
],
selected: null,
correct: null
},
{
type: "text",
text: "What is the largest sea turtle on earth?",
possibilities: [
{
answer: "Eastern Snake Necked Turtle"
},
{
answer: "Olive Ridley Sea Turtle"
},
{
answer: "Kemp's Ridley Sea Turtle'"
},
{
answer: "Leatherback"
}
],
selected: null,
correct: null
},
{
type: "text",
text: "How much can a loggerhead weigh?",
possibilities: [
{
answer: "Up to 20kg"
},
{
answer: "Up to 115kg"
},
{
answer: "Up to 220kg"
},
{
answer: "Up to 500kg"
}
],
selected: null,
correct: null
},
{
type: "text",
text: "How Heavy can a leatherback turtle be?",
possibilities: [
{
answer: "900kg"
},
{
answer: "40kg"
},
{
answer: "110kg"
},
{
answer: "300kg"
}
],
selected: null,
correct: null
},
{
type: "text",
text: "Which of these turtles are herbivores?",
possibilities: [
{
answer: "Loggerhead Turtle"
},
{
answer: "Hawksbill Turtle"
},
{
answer: "Leatherback Turtle"
},
{
answer: "Green Turtle"
}
],
selected: null,
correct: null
}
];
})();
Комментарии:
1. включали ли вы файл модуля в свои скрипты?
2. Я думаю, что где-то вы упомянули module как
myAppно ваш модуль объявлен какMyApp. Проверьте все упоминания имени модуля.3. Спасибо. Я исправил это, и теперь я получаю ошибку: Error: [$ injector: unpr] Неизвестный поставщик: dataserviceProvider
4. пожалуйста, обновите вопрос с помощью dataservice.js файл
5. Спасибо, что я добавил dataservice.js
Ответ №1:
Что касается ошибки, которую вы получаете, убедитесь, что имя модуля / службы / etc указано правильно, и зависимости загружены до их использования:
- Угловые модули чувствительны к регистру, поэтому убедитесь, что вы везде используете одно и то же имя, есть некоторые «MyApp» и некоторые «MyApp», они не совпадают
- Убедитесь, что зависимости загружены, прежде чем пытаться внедрить / использовать их, например, если вы пытаетесь внедрить какую-либо службу в контроллер, убедитесь, что она загружена перед этим контроллером.
Надеюсь, это поможет.
-Спасибо
Комментарии:
1. Спасибо. Я пробовал это. Я изменил приведенный выше код, чтобы отобразить изменения:
Ответ №2:
Имена модулей чувствительны к регистру, в quizMetrics у вас есть MyApp вместо MyApp. это, вероятно, решит вашу проблему.
Комментарии:
1. Я исправил это, как только саджан упомянул об этом в своем комментарии
Ответ №3:
При внедрении в контроллер используйте ‘DataService’ вместо ‘dataservice’.