angularjs> router resolve> "Erreur: [$ injector: unpr] Fournisseur inconnu"

Question

J'essaie d'ajouter une résolution \ promesse à mon projet, donc quand vous demandez une page, il se chargera seulement après avoir reçu le json du serveur. ceci est mon code js:

'use strict'; 

angular.module('myApp.show', ['ngRoute']) 

.config(['$routeProvider', function ($routeProvider) { 
$routeProvider.when('/show', { 
    templateUrl: 'views/show.html', 
    controller: 'showCtrl', 
    resolve: { 
     booksList: function ($http) { 
      return ($http.get('data/books.json') 
       .then(function (data) { 
        return data; 
       })); 
     } 
    } 
    }); 
}]) 

.controller('showCtrl', ['booksList', '$scope', function (booksList, $scope) { 
    $scope.books = booksList; 
    $scope.removeRow = function (productIndex) { 
     if (window.confirm("are you sure?")) { 
      $scope.books.splice(productIndex, 1); 
    } 
    } 
}]) 

mais ce que je reçois: Erreur: [injecteur $: UNPR] fournisseur inconnu: booksListProvider < - booksList < - showCtrl

i un peu nouveau à angulaire, mais j'ai suivi plusieurs tutoriels et même si cela a fonctionné dans la vidéo - je continue d'obtenir des erreurs.

html:

<div class="table-responsive"> 
    <div ng-app="myApp.show" ng-controller="showCtrl"> <!-- ctrl --> 
     <table st-table="rowCollection" class="table table-striped"> 
      <thead> 
       <tr> 
        <th st-sort="author">Author</th> 
        <th st-sort="date">Date</th> 
        <th st-sort="title">Title</th> 
        <th></th> 
       </tr> 
      </thead> 
      <tbody> 
      <tr ng-repeat="(bookIndex, book) in books"> 
       <td class="col-md-3">{{ book.author }}</td> 
       <td class="col-md-3">{{ book.date | date }}</td> 
       <td class="col-md-4">{{ book.title | beutifyTitle }}</td> 
       <td class="col-md-1"><ng-include src="'views/partials/editBook.html'"></ng-include></td> 
       <td class="col-md-1"><button class="btn btn-warning" ng-click="removeRow()">Delete</button></td> 
       </tr> 
      </tbody> 
     </table> 
    </div> 
</div 

Answer 1

Vous devez être enlever ng-controller="showCtrl" de votre modèle. La raison en est, vous assignez showCtrl via le routeur déjà. Mais comme vous êtes à nouveau écrit ng-controller sur le modèle en ligne dans ce cas, il ne parvient pas à obtenir booksList résoudre le fournisseur.