Angular controller not being called

Question

I am new to Angular.js and trying to get get routing working but in my app the second bellow route does not call the listController so I am not getting back data.

I have been through many working examples but cannot seem to work out why this is not working in my app? I get the template back /Categories/SixGrid but as mentioned the controller seem to not being called. Is there something obvious I am not doing wrong? Or can anyone share their knowledge on why this may not be working?

Updated code:

angular.module('App', ['App.Controller']).
    config(['$routeProvider', function ($routeProvider) {
        $routeProvider.when('/', { templateUrl: '/Home/Splash' });
        $routeProvider.when('/Categories/List/:slug', { templateUrl: '/Categories/SixGrid', controller:'listController' });
    }]);

angular.module('App.Controller', [])
    .controller("listController", function ($scope, $http) {
        $http.get('../../api/cat/' + $routeParams.slug).success(function (data) {
                    $scope.products = data;
                });
});

You say you get the template back from Categories/List while your route specifies that the template is to be found at Categories/SixGrid. How come? Also, you have an extraneous comma in your second route. Plus, your ../../ path is a bit uncommon for API call, although that shouldn't cause an error. — Stewie
– Stewie, Commented Apr 2, 2013 at 13:00
Thanks Stewie, was a spelling error. Categories/SixGrid is the correct template that comes back. Also removed the comma. The Api route is not currently ideal but am still in the early stages of dev — ojhawkins
– ojhawkins, Commented Apr 2, 2013 at 13:06
can you show your template. Better put your code on jsfiddle. so people can play with it and find what's wrong more quickly :) — Tzu ng
– Tzu ng, Commented Apr 2, 2013 at 13:22
Can you describe your file structure? In which file is the above code written? In which file is the definition of this controller? Has this file been referenced in your HTML page? If they are two separate files, the file containing the controller should be referenced before the file containing the above code... — callmekatootie
– callmekatootie, Commented Apr 2, 2013 at 13:50
In chrome/firefox debugging, do you see the $get request create any traffic? What if you put a console.log in there? — Foo L
– Foo L, Commented Apr 3, 2013 at 0:05

ardentum-c · Accepted Answer · 2013-04-02 13:00:32Z

5

Try to wrap controller name in quotes:

$routeProvider.when('/Categories/List/:slug', {
    templateUrl: '/Categories/SixGrid',
    controller: 'listController'
});

Also good practice is to define controllers by this way (because global scope remains clean):

angular.module('App').controller("listController", function () {
    //controllerCode
});

answered Apr 2, 2013 at 13:00

ardentum-c

1,41013 silver badges11 bronze badges

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

1 Comment

ojhawkins Over a year ago

Thanks @ardentum-c. Still no luck, I have updated the code above to what I have now. Could the issue be somewhere else?

Collectives™ on Stack Overflow

Angular controller not being called

1 Answer 1

1 Comment

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Related