AngularJS TypeError: undefined is not a function on ng-view directive

Question

I'm trying to wire up a simple AngularJS app and I cannot get past a undefined is not a function error on my view directive. The weird thing is that the first view actually loads up and is rendered to the directive but I am unable to navigate to my 2nd view. The controllers definitely aren't running. I'm not sure what's going on here. Any ideas?

Angular version: 1.2.26 (same error with 1.2.20)

Error

TypeError: Undefined is not a function

App Code

var app = angular.module('myApp', ['ngRoute', 'ngResource']);

app.controller('Home', ['$scope', function ($scope) {
    console.log('Home controller hit.');
}]);

app.controller('About', ['$scope', function ($scope) {
    console.log('About controller hit.');
}]);


app.config(function ($routeProvider, $locationProvider) {
    $locationProvider.html5Mode(true);
    $routeProvider.when('/', { templateUrl: 'SiteAssets/views/home.html', controller: 'Home' })
    .when('/home', { templateUrl: 'SiteAssets/views/home.html', controller: 'Home' })
    .when('/about', { templateUrl: 'SiteAssets/views/about.html', controller: 'About' })
    .otherwise({ redirectTo: '/' });
});

Can you provide a [plunkr](http://plnkr.co/) or a [jsfiddle](http://jsfiddle.net/)? — bmleite, Oct 10 '14 at 14:49

Jared Reeves · Answer 1 · 2014-10-10T15:37:37.967

1

You need to inject $document into your controllers like this:

app.controller('About', ['$scope','$document', function ($scope, $document) {
  $document.title = 'About Us';
  console.log('About controller hit.');
}]);

It might be the $document that is throwing the error, as angular does not know what it is without the injection. However, the error for this issue would be an Error: Unknown provider:

edited Oct 10 '14 at 15:37

answered Oct 10 '14 at 15:14

Jared Reeves

1,390
2
15
29

score 0 · Accepted Answer · answered Oct 10 '14 at 15:21

0

This issue was caused by an error in a script within my Home View. I'm still having an issue with my second view loading up. Thanks to all who helped me on this issue.

answered Oct 10 '14 at 15:21

ExceptionLimeCat

6,191
6
44
77

You still need to inject the $document into you controllers. See [Doumentation](https://docs.angularjs.org/api/ng/service/$document) and look at the script example. – Jared Reeves Oct 10 '14 at 15:32
@JaredReeves You are correct but I have removed the `$document` reference from the controller since it is a separate issue. – ExceptionLimeCat Oct 10 '14 at 16:47
Did you ever get a plnker up, or have you fixed the all the issues. – Jared Reeves Oct 10 '14 at 19:59

AngularJS TypeError: undefined is not a function on ng-view directive

2 Answers2