CODEWITHSUNDEEP
javascriptangularjs
Cdev
Cdev

Reputation: 13

AngularJS - simple partial not loading

I'm unable to get my partial to load with angular 1.3. I've seen the common mistakes such as not loading angular-route.js, or specifying 'ngRoute' in my app module. I don't see any errors in the console. I've looked at all the 'partials not loading' posts, and they don't seem to apply here. Any idea what's going on here? Thanks!

index.html

<html ng-app="App">
<head></head>
<body ng-controller="MainController">

<div ng-view=""></div>

<script src="scripts/angular/angular.js"></script>
<script src="scripts/angular/angular-route.js"></script>
<script src="scripts/app.js"></script>
<script src="scripts/controllers.js"></script>
<body>
</html>

app.js

(function() {
var app = angular.module('App', ['ngRoute']);

app.config(function($routeProvider) {
    $routeProvider
        .when('/', 
            {
                controller: 'MainController',
                templateURL: './partials/test.html'
            })
        .otherwise({ redirectTo: '/' });
    });

}());

controllers.js

(function() {
    var MainController = function ($scope) {
        $scope.model = {
            message: 'Aaarrrgh!'
        };
    };
    MainController.$inject = ['$scope'];
    angular.module('App').controller('MainController',  MainController);    
}());

test.html (my partial)

<h1>{{model.message}}</h1>

Where I should see my content, I see an html comment: 

<!-- ngView: -->

Upvotes: 1

Views: 642

Answers (1)

New Dev
New Dev

Reputation: 49590

Rename templateURL to templateUrl

Upvotes: 2

Related Questions