Why does AngularJS send double network requests?

Question

I have the code shown below in a controller for an AngularJS Single Page Application. When this page runs and I check Developer Tools Network (in IE, Chrome, and Firefox) it always shows 2 successful GET calls to Tables, and two empty OPTIONS calls to Tables. Why are there 2 GET calls? Is that normal or did I do something wrong in my code? Also, why does it issue the 2 OPTIONS calls?

"use strict";

app.controller('AdminController', function ($scope, $http)
{
    $scope.$parent.Title = "Admin";

    var url = $scope.$parent.BaseUrl + "Tables";
    $http.get(url)
        .then(function mySuccess(response)
        {
            $scope.MyTables = response.data;
        });
});

may be you use "resolve" in navigation, the best way to find the issue is to set "debugger" before you call $http service — Denis
– Denis, Commented Jun 10, 2016 at 14:49
The OPTIONS requests are probably caused by CORS, i.e. you'res sending requests to a host/port other than the one where the scripts come from. — JB Nizet
– JB Nizet, Commented Jun 10, 2016 at 14:52
JB, I am calling EnableCors. Does that account for the OPTIONS call? — Steve Gaines
– Steve Gaines, Commented Jun 10, 2016 at 14:53
M.Doye, I didn't intend to define the controller more than once. In the html page I have <div ng-controller="AdminController">. I thought I need to name it in the html page and then declare it again in the controller. Is that wrong? — Steve Gaines
– Steve Gaines, Commented Jun 10, 2016 at 14:54

Michael Doye · Accepted Answer · 2016-06-10 15:22:49Z

5

This has happened to me in the past, the issue was that I had defined my controller twice, once in the route:

.state('app.state', {
  url: '/state',
  controller: 'SomeCtrl',
  templateUrl: 'views/state.html'
})

and then defined it again in my view HTML:

<div ng-controller="SomeCtrl"></div>

As far as I am aware, you should only define it in one or the other.

edited Jun 10, 2016 at 15:22

answered Jun 10, 2016 at 14:57

Michael Doye

8,2115 gold badges43 silver badges57 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Steve Gaines Over a year ago

As noted above in the "controller" page I have app.controller('AdminController', function ($scope, $http) and in the html page I have <div ng-controller="AdminController">. Should I remove the ng-controller in the html page? I thought it needs both to work?

Michael Doye Over a year ago

If you have defined it in your route, you don't need to add it to the HTML again

Steve Gaines Over a year ago

I removed the ng-controller in the html page and I tried it. It works with only one network GET call (and one OPTIONS call). So I have marked your answer as the solution. Now I am confused about how AngularJS defines its controllers. I thought it needed to be marked in the html page so that it would know what part of the page is controlled by that controller.

Michael Doye Over a year ago

You can add it to your HTML if you prefer, and remove it from the route, it really depends on your app structure, but here is a pretty simple explanation - stackoverflow.com/a/21434352/3055401

Steve Gaines Over a year ago

M.Doye - Thanks but that link just raises more questions in my mind. In the "route" I have .when('/Admin', { templateUrl: 'App/Views/Admin.html', controller: 'AdminController' }), then in the "controller" I have app.controller('AdminController', function ($scope, $http) {...}, and I used to have <div ng-controller="AdminController"> in the page. I still don't see how they can work together if I remove one of them, but I removed the ng-controller attribute and it seems to be working.

Collectives™ on Stack Overflow

Why does AngularJS send double network requests?

1 Answer 1

5 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related