Ошибка Angular JS: ошибка модуля $injector:modulerr

Я создаю службу в angular JS и пытаюсь запустить, но она дает мне ошибку, как показано ниже.

Failed to instantiate module myapp due to:
Error: [$injector:nomod] Module 'myapp' 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.
http://errors.angularjs.org/1.5.5/$injector/nomod?p0=myapp
at file:///D:/Angular/First/lib/angular.js:68:12
at file:///D:/Angular/First/lib/angular.js:2070:17
at ensure (file:///D:/Angular/First/lib/angular.js:1994:38)
at module (file:///D:/Angular/First/lib/angular.js:2068:14)
at file:///D:/Angular/First/lib/angular.js:4564:22
at forEach (file:///D:/Angular/First/lib/angular.js:322:20)
at loadModules (file:///D:/Angular/First/lib/angular.js:4548:5)
at createInjector (file:///D:/Angular/First/lib/angular.js:4470:19)
at doBootstrap (file:///D:/Angular/First/lib/angular.js:1746:20)
at bootstrap (file:///D:/Angular/First/lib/angular.js:1767:12

Я поделился файлом js и html ниже, пожалуйста, смотрите. Это очень странно, я пытался создать новый js и html, но та же ошибка.

"use strict";

angular.module('myapp', []);

angular.module('myapp').controller('MainController', ['$scope', function($scope) {

    $scope.message = 'Hello';

    $scope.sayHello = function(name){
        return $scope.message + ' ' + name;
    };

}]);

angular.module('myapp').controller('IntController', ['$scope', '$interval', function($scope, $interval){

    var items = ['bananas', 'apples', 'pears', 'mango', 'peeches'];

    $scope.itemIndex = null;
    $scope.currentItem = '';

    $scope.getItem = function(){
        $scope.currentItem = items[$scope.itemIndex];
    };

    $interval(function(){
        $scope.itemIndex = Math.round(Math.random() * (items.length - 1));
        $scope.getItem();
    }, 2000);

}]);

angular.module('myapp').controller('ExpressionController', ['$scope', '$interval', function($scope, $interval){

    $scope.randomValue = -999;

    $scope.names = ['Nikhil', 'Ankit', 'Yaghwinder'];

    $scope.qty = 2;
    $scope.cost = 12.7;

    $scope.pWidth = 100;

    $interval(function(){
        $scope.randomValue = Math.round(Math.random() * 100000);
    }, 2000);

}]);

angular.module('myapp').controller('ParentController', ['$scope', function($scope){

    $scope.object = {
        name: 'Nikhil Gupta'
    };

}]);

angular.module('myapp').controller('ChildController', ['$scope', function($scope){



}]);

angular.module('myapp').controller('SuperController', ['$scope', function($scope){

    $scope.object = {
        name: 'Nikhil Gupta'
    };

}]);

angular.module('myapp').controller('FirstController', ['$scope', function($scope){

}]);

angular.module('myapp').controller('SecondController', ['$scope', function($scope){

}]);

angular.module('myapp').service('SharedService', fuction($http){
return {name: 'Yaghwinder Bhatti'};
});

angular.module('myapp').controller('SFirstController', ['$scope', 'SharedService', function($scope, SharedService){
    $scope.object = SharedService;
}]);

angular.module('myapp').controller('SSecondController', ['$scope', 'SharedService', function($scope, SharedService){
    $scope.object = SharedService;      
}]);

И HTML-файл

<html ng-app="myapp">
<head>
    <title>Angular Setup</title>
    <script type="text/javascript" src="../lib/angular.js"></script>
    <script type="text/javascript" src="app.js"></script>
</head>
<body>  
    <div ng-controller="MainController">
        <p>{{ sayHello('Nikhil') }}</p>
    </div>  
    <br></br>
    <div ng-controller="IntController">
        <!--ng-model is an data way data binding -->
        <p><input type="text" ng-model="itemIndex"> <input type="button" value="Get Item" ng-click="getItem()"></p>
        <p>Current Item : {{ currentItem }} </p>
    </div>  
    <br></br>
    <div ng-controller="ExpressionController">
        <p>Standard Bracket Expression</p>
        <p>{{ randomValue }}</p>
        <p>One Time Bracket Expression</p>
        <p>{{ ::randomValue }}</p>
        <p>Array Bracket Expression</p>
        <p>{{ names[1] }}</p>
        <p>operation Bracket Expression</p>
        <p>{{ qty * cost }}</p>
        <p>Greater than 50000?</p>
        <p>{{ randomValue > 50000 }}</p>
        <p>Enter Width: <input type="text" ng-model="pWidth"></p>
        <p style="background:#ff0000;width:{{pWidth}}px">
        This is a Test for the width.
        </p>
    </div>

    <br></br>

    <div ng-controller="ParentController">

        <input type="text" ng-model="object.name">
        <p>This is Parent : {{object.name}}</p>

        <div ng-controller="ChildController">

            <input type="text" ng-model="object.name">
            <p>This is Child : {{object.name}}</p>  

        </div>

    </div>

    <div ng-controller="ParentController">

        <input type="text" ng-model="object.name">
        <p>This is Second Parent : {{object.name}}</p>

    </div>

    <br></br>

    <div ng-controller="SuperController">

        <div ng-controller="FirstController">

            <input type="text" ng-model="object.name">
            <p>This is Child : {{object.name}}</p>  

        </div>

        <div ng-controller="SecondController">

            <input type="text" ng-model="object.name">
            <p>This is Child : {{object.name}}</p>  

        </div>

    </div>

    <br></br>

    <div ng-controller="SFirstController">

        <input type="text" ng-model="object.name">
        <p>This is Child : {{object.name}}</p>  

    </div>

    <div ng-controller="SSecondController">

        <input type="text" ng-model="object.name">
        <p>This is Child : {{object.name}}</p>  

    </div>

    <br></br>

</body>

</html>

У меня есть angular js версии 1.5.x, я попытался найти ошибку на консоли Chrome и нашел ошибку ниже, но это не имеет никакого смысла.

app.js:80 Uncaught SyntaxError: missing ) after argument list
Uncaught Error: [$injector:modulerr] Failed to instantiate module myapp due to:
Error: [$injector:nomod] Module 'myapp' 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.
http://errors.angularjs.org/1.5.5/$injector/nomod?p0=myapp
at file:///D:/Angular/First/lib/angular.js:68:12
at file:///D:/Angular/First/lib/angular.js:2070:17
at ensure (file:///D:/Angular/First/lib/angular.js:1994:38)
at module (file:///D:/Angular/First/lib/angular.js:2068:14)
at file:///D:/Angular/First/lib/angular.js:4564:22
at forEach (file:///D:/Angular/First/lib/angular.js:322:20)
at loadModules (file:///D:/Angular/First/lib/angular.js:4548:5)
at createInjector (file:///D:/Angular/First/lib/angular.js:4470:19)
at doBootstrap (file:///D:/Angular/First/lib/angular.js:1746:20)
at bootstrap (file:///D:/Angular/First/lib/angular.js:1767:12)
http://errors.angularjs.org/1.5.5/$injector/modulerr?p0=myapp&p1=Error%3A%2…p%20(file%3A%2F%2F%2FD%3A%2FAngular%2FFirst%2Flib%2Fangular.js%3A1767%3A12)

angularjs angular-services
person nikhilgupta86    schedule 30.05.2016    source источник
comment
У вас опечатка при создании службы SharedService. fuction должно быть function. Приложение работает как положено после этого исправления.   -  person IanGabes    schedule 30.05.2016

Ответы (1)


arrow_upward
1
arrow_downward

Вы неправильно написали слово function здесь:

angular.module('myapp').service('SharedService', function($http){ //was fuction
    return {name: 'Yaghwinder Bhatti'};
});
person Omri Aharon    schedule 30.05.2016
comment
Спасибо, это была проблема, но я все еще не понимаю, почему ошибка app.js: 80 Uncaught SyntaxError: отсутствует) после списка аргументов. Из-за чего я проверял то же самое и пренебрегал заклинанием, спасибо за вашу помощь, ура :) - person nikhilgupta86; 30.05.2016