When I try to include other HTML files as templates in my index.html using the ng-view directive, I encounter an error message:
Unknown provider: $templateRequestProvider <- $templateRequest <- $route <- ngViewDirective'use strict';
var surveyApp = angular.module('surveyApp',['ngRoute']);
surveyApp.factory('surveyFactory',function (){
return {}
});
Below are the Controllers being used:
surveyApp.controller('profileController', function($scope,surveyFactory) {
// create a message to display in our view
$scope.message = 'This is the profile page';
});
surveyApp.controller('surveysController', function($scope,surveyFactory) {
// create a message to display in our view
$scope.message = 'This is the surveys page';
});
The Configurations set up for the routes:
surveyApp.config(function($routeProvider, $locationProvider) {
$routeProvider
.when('/', {
templateUrl : 'pages/profile.html',
controller : 'profileController'
})
.when('/surveys', {
templateUrl : 'pages/surveys.html',
controller : 'surveysController'
});
$locationProvider.html5Mode(true);
});
This is the structure of the HTML content:
<body ng-app="surveyApp">
<div id="main">
<div ng-view></div>
</div>
</body>
Can someone help me identify where I might be missing something?