CODEWITHSUNDEEP
javascriptangularjsangularjs-directive
Shikhar
Shikhar

Reputation: 971

Angularjs unknown provider in $templateRequestProvider

I am including other html files as template in index.html. For this i am using ng-view directive. But i am getting an error: Unknown provider: $templateRequestProvider <- $templateRequest <- $route <- ngViewDirective The code I am using is: 

'use strict';
 var surveyApp = angular.module('surveyApp',['ngRoute']);
    surveyApp.factory('surveyFactory',function (){
 return {}
});

Here are the Controllers : 

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 Config: 

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 HTML:

<body ng-app="surveyApp">
    <div id="main">
        <div ng-view></div>
    </div>
</body>

Where am I missing?

Upvotes: 24

Views: 23174

Answers (3)

Shikhar
Shikhar

Reputation: 971

Done. In most of the cases it would be the versions of angular-route and angularjs were conflicting. After then, it mostly crashed the page due to continuous loop requests in 

.when('/', {    
    templateUrl : 'pages/profile.html',
    controller  : 'profileController'
})

Every time it saw a '/', it redirected to the same page all over again and hence forming an infinite redirect loop. This should be used in the last so that the first ones are checked, and if something remains, then it sees the '/' route.

Upvotes: 41

Millenjo
Millenjo

Reputation: 441

Had the same problem, the issue for me was also a dependancy but not angular-route. The dependancy that caused the error for me was angular-bootstrap.

The current angular version in our project is 1.28 and angular-route is also 1.28. This error was triggered on updating angular-bootstrap from 0.12.1 to 0.13.

Upvotes: 4

Aditya Singh
Aditya Singh

Reputation: 16660

The only issue with your code is the missing closing curly brace after surveyFactory definition.

Change the code for app and factory definition to below to fix the issue:

  var surveyApp = angular.module('surveyApp',['ngRoute']);

  surveyApp.factory('surveyFactory',function (){
      return {}
  });

Upvotes: 1

Related Questions