0

I'm new to AngularJS. I don't know how to get the response in post method. I got the error below like this. I just print the response value in console. I want to know what JS files are needed to add.

 angular.js:12330 Error: [$injector:unpr] http://errors.angularjs.org/1.4.3/$injector/unpr?p0=%24httpProviderProvider%20%3C-%20%24httpProvider%20%3C-%20myapp at Error (native at)

Please help me to resolve the problem

app.js

var app= angular.module('demo', ['ngRoute']);
app.controller('myapp', ["$scope", "$http" ,"$q","$httpProvider", function($scope, $http, $q,$httpProvider) {
      $httpProvider.defaults.useXDomain = true;
                $httpProvider.defaults.withCredentials = true;
                delete $httpProvider.defaults.headers.common['X-Requested-With'];   
        var data = $.param({
            json: JSON.stringify({
                id:'SYZ2015011'
            })
        });
        console.log(data);
        $http.post('http://syzygyapp.com/apistaffattendance/index.php/api/employee/getEmployeeHours', data, config)
            .success(function (data, status, headers, config) {
                 $scope.hello = result;
            console.log($scope.hello);
            })
            .error(function (data, status, header, config) {
                $scope.ResponseDetails = "Data: " + data +
                    "<hr />status: " + status +
                    "<hr />headers: " + header +
                    "<hr />config: " + config;
            });



}]);

index.html
    <!doctype html>
    <html ng-app="demo">
    <head>
    <title>Hello AngularJS</title>
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.min.js"></script>
    <script src="js/angular-route.min.js"></script>
            <script src="app.js"></script>
    </head>
    <body>
    <div ng-controller="myapp">
    <!-- <p>The ID is {{greeting.id}}</p>
    <p>The content is {{greeting.content}}</p> -->
    <table class="table table-striped table-bordered">
            <thead>
            <th>Field1&nbsp;</th>
            <th>Field2&nbsp;</th>
            <th>Field3&nbsp;</th>
            <th>Field4&nbsp;</th>
         </thead>
            <tbody>
                <!-- <tr ng-repeat="data in greeting">
                    <td>{{data.body}}</td>
                    <td>{{data.id}}</td>
                    <td>{{data.title}}</td>
                    <td>{{data.userId}}</td> -->
                    <!-- <td>{{data.country}}</td>
                    <td><a href="#/edit-customer/{{data.customerNumber}}" class="btn">&nbsp;<i class="glyphicon glyphicon-edit"></i>&nbsp; Edit Customer</a></td> -->
               <!--  </tr> -->
            </tbody>
            </table>
            </div>
        </body>
    </html>
    <!-- <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.min.js"></script>
    <script src="app.js"></script> -->
3
  • Please add your index.html file as well Commented Sep 17, 2016 at 7:29
  • index.html file is added Commented Sep 17, 2016 at 9:17
  • You should use the "config" function of your module to configure your "httpProvider" (like here: stackoverflow.com/questions/19364450/…), then you only use the "$http" service in your controller to do what you want. Moreover, "config" is undefined, so passing it to "post" function of "$http" could cause an issue. And, on the top of that, I would use "then" instead of "success" (see stackoverflow.com/questions/17080146/…) Commented Sep 20, 2016 at 7:02

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.