codergirrl
codergirrl

Reputation: 155

Error: [$injector:unpr] in AngularJS

I am working on a webApi Project. I want to list students in my database. When I do this without using service (factory) it works. But when I create a service it doesn't work and I get an error. I know there is same problems in this website. but answers didn't work so I ask. Here is my files;

studentServis.js:

(function () {
'use strict';

angular
    .module('studentApp')
    .factory('studentService', [
        "$http","studentApiUrl",
        function ( $http,studentApiUrl) {
            var getAll = function () {
                return $http.get(studentApiUrl);
            };   
            var service = {
                getAll: getAll
            };

            return service;
        }

    ]);

})();

studentController.js:

(function () {
'use strict';

angular
    .module('studentApp')
    .controller('studentController', [
        "$scope", "studentService",
        function ($scope, studentService) {
            $scope.message = "hey";

            studentService.getAll().then(function (data) {
                $scope.students = data;
            });
        }

    ]); })();

studentApp.js:

(function () {
'use strict';

var app=angular.module('studentApp', [
    // Angular modules 
    'ngRoute'
]).constant('studentApiUrl', "/api/student/"); })();

Index.html:

 <div ng-app="studentApp">
    <div ng-controller="studentController">
        {{message}}

        <table class="table table-bordered">
            <tbody>
                <tr ng-repeat="student in students">
                    <td>{{student.id}}</td>
                    <td>{{student.firstname}}</td>
                    <td>{{student.lastname}}</td>
                    <td>{{student.university}}</td>
                    <td>
                        <a href="#/details/{{student.id}}" class="btn btn-default btn-sm">Edit</a>
                        <button class="btn btn-danger btn-sm" ng-click="delete(student)">Delete</button> -->
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
</div>

$scope.message (hey) part is only for try. It doesn't print it too. Output is in website:

{{message}}

and nothing about my student list.

Here is the error:

http://errors.angularjs.org/1.7.2/$injector/unpr?p0=studentServiceProvider%20%3C-%20studentService%20%3C-%20studentController

angular.js:15018 Error: [$injector:unpr] 
at angular.js:99
at angular.js:4891
at Object.d [as get] (angular.js:5051)
at angular.js:4896
at d (angular.js:5051)
at e (angular.js:5076)
at Object.invoke (angular.js:5100)
at P.instance (angular.js:11160)
at p (angular.js:10031)
at g (angular.js:9370)

I looked here but I think I did correctly telling there: AngularJS Error Reference - $injector unpr

here is references in index:

<head>
<meta charset="utf-8" />
<title></title>
<script src="../../Scripts/angular.min.js"></script>
<script src="../../Scripts/angular.js"></script>
<script src="../../Scripts/angular-route.js"></script>
<script src="../Scripts/studentApp.js"></script>
<script src="../Scripts/studentServis.js"></script>
<script src="../Scripts/studentController.js"></script>

<link href="../../Content/Site.css" rel="stylesheet" />
<link href="../../Content/bootstrap.css" rel="stylesheet" />  

Okay is there anybody can help me?

Upvotes: 0

Views: 1867

Answers (1)

Sajeetharan
Sajeetharan

Reputation: 222722

I do not see anywhere you are loading your service in references, the order should be,

<script src="../Scripts/studentApp.js"></script>
<script src="../Scripts/studentServis.js"></script>
<script src="../Scripts/studentController.js"></script>

Upvotes: 1

Related Questions