angularjs infinite request loop for $resource

Question

for some reason when I hit a certain route in angular I crash the browser and my node server freaks out making tons of requests:

GET /bower_components/bootstrap/dist/js/bootstrap.js?_=1402331354670 200 3ms - 53.96kb
GET /js/app.js?_=1402331354671 200 1ms - 1.56kb
GET /js/controllers/main.js?_=1402331354672 200 2ms - 140b
GET /js/controllers/login.js?_=1402331354673 200 3ms - 735b
GET /js/controllers/userList.js?_=1402331354674 200 2ms - 120b
GET /js/controllers/signup.js?_=1402331354675 200 1ms - 465b
GET /js/controllers/profile.js?_=1402331354676 200 1ms - 665b
GET /js/controllers/courseList.js?_=1402331354677 200 1ms - 369b
GET /js/controllers/courseDetails.js?_=1402331354678 200 4ms - 281b
GET /js/filters/titleize.js?_=1402331354685 200 1ms - 381b
GET /bower_components/jquery/dist/jquery.min.js?_=1402331354686 200 2ms - 82.3kb
GET /bower_components/angular/angular.min.js?_=1402331354687 200 1ms - 102kb
GET /bower_components/angular-route/angular-route.min.js?_=1402331354689 200 2ms - 3.86kb
...again and again forever

The route I click:

a(ng-href='/courses/{{ course._id }}') {{ course.title }}

defined in app.js:

    $routeProvider.when('/courses/:id', {
        templateUrl: 'views/courses/details',
        controller: 'CourseDetailsCtrl',
    })

The controller:

app.controller('CourseDetailsCtrl', ['$scope', function($scope){
    console.log('commented everything out. doesnt display')
}])

The Course service:

app.factory('Course', ['$resource', function($resource){
    var courseResource = $resource('/api/courses/:_id', {_id: '@id'}, {
        update: {
            method: 'PUT',
            isArray: false
        }
    });

    return courseResource;
}]);

On the server side the routes are:

app.get('/api/courses/:id', function(req, res, next){
    console.log('this never logs')
})
app.all('/api/*', function(req, res){
    res.send(404)
})

app.get('*', function(req, res){
    res.render('index', {
        currentUser: req.user
    })
})

I'm really confused why the course partial doesn't render and the browser crashes

That `ng-href` should probably be `#/courses/{{ course._id }}`. What do you see in your DevTools's Network tab ? — gkalpak, Jun 09 '14 at 17:07
Are you using templateCache or is your template named 'details'? — Catalin MUNTEANU, Jun 09 '14 at 17:26
Try changing the app.get('/api/courses/..') with app.post('/api/courses/..') — Catalin MUNTEANU, Jun 09 '14 at 17:43
i can hit the `localhost:3000/api/courses/3438294dfgdf34894` fine. It gives me back the JSON for that course — Connor Leech, Jun 09 '14 at 17:59

score 1 · Accepted Answer · answered Jun 10 '14 at 21:26

1

It turns out my client side route needed to be

$routeProvider.when('/courses/:id', {
    templateUrl: '/views/courses/details',
    controller: 'CourseDetailsCtrl',
})

One missing / in the templateUrl path

answered Jun 10 '14 at 21:26

Connor Leech

18,052
30
105
150

angularjs infinite request loop for $resource

1 Answers1