2016-07-16 11 views
0

Ich halte diesen Fehler und ich kann es nicht verstehen, warum:

angular.js:13708 Error: [$injector:unpr] Unknown provider: fstackProvider <- fstack <- MainController 

Hier eine config.js Datei ist:

angular.module("app") 
.constant("fstack", "xxxxxxxxxxxxxx"); 

Hier ist meine app.js Datei:

(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 handles the client request to switch route 
     $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 in all the other cases. 
     .otherwise({redirectTo:'/'}); 

     filepickerProvider.setKey('{{fstack}}'); 
}); 
})(); 

Hier einige meiner HTML-Datei ist:

<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> 
<!-- Here is where the partials will be displayed --> 
<div ng-view ng-controller="MainController"></div> 

Wenn ich den ng-Controller = "MainController" Ich werde diesen Fehler hinzufügen. Ich versuche auf den $ scope.fstack zuzugreifen, also dachte ich, ich sollte den MainController hinzufügen. Es ist offensichtlich, dass ich nicht weiß, was ich tue, aber wenn jemand irgendwelche Gedanken hat, die mir helfen könnten, wäre das großartig. Ich muss den Wert, der in $scope.fstack enthalten ist, auf diesen Set-Key bekommen.

filepickerProvider.setKey('{{fstack}}'); 
+0

Siehe [this] (https://docs.angularjs.org/error/$injector/unpr) Artikel. –

+0

Versuchen Sie '.constant (" fstack "," xxxxxxxxxxxxxx ")' in 'app.js' hinzuzufügen! –

+0

Das xxxxxxxxxxxx ist ein API-Schlüssel, den ich nicht im Browser verfügbar machen möchte. Wenn ich das tue, wird das xxxxxxxxxxxx für Leute verfügbar sein, um in den Browser zu gelangen? –

Antwort

1

Ich denke, Sie müssen alles erklären, was Sie in den Controller injizieren.

Versuchen app.controller('MainController', ['$scope', 'fstack', MainController]);

0

vor Controller konstant definieren.

angular.module("app") 
    .constant("fstack", "xxxxxxxxxxxxxx"); 

     app.controller('MainController', MainController); 
     function MainController($scope, fstack) { 
     $scope.fstack = fstack; 
     } 
+0

Wenn ich dies mache, wird das xxxxxxxx Leuten im Browser ausgesetzt sein? Es ist ein API-Schlüssel. Vielen Dank –