I've been encountering this specific error repeatedly and I'm unable to pinpoint the cause:
angular.js:13708 Error: [$injector:unpr] Unknown provider: fstackProvider <- fstack <- MainController
Here is a snippet from my config.js file:
angular.module("app")
.constant("fstack", "xxxxxxxxxxxxxx");
And here's a part of my app.js file:
(function(){
var app = angular.module('app', ['addCarCtrl', 'galleryCtrl','detailCtrl', 'userCtrl', 'ngRoute', 'angular-filepicker'])
app.controller('MainController', MainController);
function MainController($scope, fstack) {
$scope.fstack = fstack;
}
app.config(function($routeProvider, filepickerProvider){
// The route provider deals with client requests for route changes
$routeProvider.when('/addCar', {
templateUrl: 'partials/addCar.html',
controller: 'addCarController'
})
.when('/gallery', {
templateUrl: 'partials/gallery.html',
controller: 'galleryController'
})
.when('/detail/:id', {
templateUrl: 'partials/detail.html',
controller: 'detailController'
})
.when('/login', {
templateUrl: 'partials/login.html',
controller: 'userController'
})
.when('/', {
templateUrl: 'partials/home.html'
})
// Redirect to addCar if none of the above cases match
.otherwise({redirectTo:'/'});
filepickerProvider.setKey('{{fstack}}');
});
})();
This section showcases some of my HTML structure:
<body>
<div class="container">
<nav class="navbar navbar-inverse">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand" href="#">AMC MEAN app</a>
</div>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-right">
<li role="presentation"><a href="/#/addCar">Add Car</a></li>
<li role="presentation"><a href="/#/gallery">Gallery</a></li>
</ul>
</div>
</div>
</nav>
<!-- Partials will be displayed here -->
<div ng-view ng-controller="MainController"></div>
Every time I include the ng-controller="MainController", this error surfaces. My intention is to access the value stored in $scope.fstack
and utilize it as the set key. Clearly, I am lacking some understanding in this area. Any suggestions or insights are greatly appreciated. I need to correctly assign the value contained in {{fstack}}
to the set key.
filepickerProvider.setKey('{{fstack}}');