Je continue de recevoir cette erreur alors que j'essaye d'implémenter la fenêtre modale d'amorçage. Quelle pourrait en être la cause? J'ai tout copié / collé à partir de http://angular-ui.github.io/bootstrap/#/modal ici.
Je continue de recevoir cette erreur alors que j'essaye d'implémenter la fenêtre modale d'amorçage. Quelle pourrait en être la cause? J'ai tout copié / collé à partir de http://angular-ui.github.io/bootstrap/#/modal ici.
Réponses:
Ce type d'erreur se produit lorsque vous écrivez dans une dépendance pour un contrôleur, un service, etc., et que vous n'avez pas créé ou inclus cette dépendance.
Dans ce cas, $modaln'est pas un service connu. Il semble que vous n'ayez pas passé ui-bootstrap en tant que dépendance lors de l'amorçage angulaire. angular.module('myModule', ['ui.bootstrap']);Assurez-vous également que vous utilisez la dernière version de ui-bootstrap (0.6.0), juste pour être sûr.
L'erreur est générée dans la version 0.5.0, mais la mise à jour vers 0.6.0 rend le service $ modal disponible. Donc, mettez à jour vers la version 0.6.0 et assurez-vous d'exiger ui.boostrap lors de l'enregistrement de votre module.
En réponse à votre commentaire: Voici comment vous injectez une dépendance de module.
<!-- tell Angular what module we are bootstrapping -->
<html ng-app="myApp" ng-controller="myCtrl">js:
// create the module, pass in modules it depends on
var app = angular.module('myApp', ['ui.bootstrap']);
// $modal service is now available via the ui.bootstrap module we passed in to our module
app.controller('myCtrl', function($scope, $uibModal) {
});Le $modalservice a été renommé en $uibModal.
Exemple utilisant $ uibModal
// create the module, pass in modules it depends on
var app = angular.module('myApp', ['ui.bootstrap']);
// $modal service is now available via the ui.bootstrap module we passed in to our module
app.controller('myCtrl', function($scope, $uibModal) {
//code here
});5 ans plus tard (cela n'aurait pas été le problème à l'époque) :
L'espacement des noms a changé - vous pouvez tomber sur ce message après la mise à niveau vers une version plus récente de bootstrap-ui ; vous devez vous référer à $uibModal& $uibModalInstance.
Juste une note supplémentaire pour un problème que j'ai également rencontré aujourd'hui: j'ai eu une erreur similaire "Fournisseur inconnu: $ aProvider" lorsque j'ai activé la minification / uglify de mon code source.
Comme mentionné dans le didacticiel Angular docs (paragraphe: "A Note on Minification"), vous devez utiliser la syntaxe du tableau pour vous assurer que les références sont correctement conservées pour l'injection de dépendances:
var PhoneListCtrl = ['$scope', '$http', function($scope, $http) { /* constructor body */ }];Pour l' exemple Angular UI Bootstrap, vous mentionnez que vous devez remplacer ceci:
var ModalInstanceCtrl = function ($scope, $modalInstance, items) {
/* ...example code.. */
}avec cette notation de tableau:
var ModalInstanceCtrl = ['$scope', '$modalInstance', 'items', function ($scope, $modalInstance, items) {
/* copy rest of example code here */
}];Avec ce changement, mon code de fenêtre modale de l'interface utilisateur angulaire minifiée était à nouveau fonctionnel.
La réponse évidente à l'erreur du fournisseur est la dépendance manquante lors de la déclaration d'un module comme dans le cas de l'ajout de ui-bootstrap. La seule chose dont beaucoup d'entre nous ne tiennent pas compte, ce sont les changements majeurs lors de la mise à niveau vers une nouvelle version. Oui, les éléments suivants devraient fonctionner et ne pas déclencher l'erreur de fournisseur:
var app = angular.module('app', ['ui.router', 'ngRoute', 'ui.bootstrap']);
app.factory("$svcMessage", ['$modal', svcMessage]);Sauf lorsque nous utilisons une nouvelle version de ui-boostrap. Le fournisseur modal est maintenant défini comme:
.provider('$uibModal', function() {
var $modalProvider = {
options: {
animation: true,
backdrop: true, //can also be false or 'static'
keyboard: true
},Le conseil ici est qu'une fois que nous nous sommes assurés que les dépendances sont incluses et que nous obtenons toujours cette erreur, nous devrions vérifier la version de la bibliothèque JS que nous utilisons. Nous pourrions également faire une recherche rapide et voir si ce fournisseur existe dans le fichier.
Dans ce cas, le fournisseur modal doit maintenant être le suivant:
app.factory("$svcMessage", ['$uibModal', svcMessage]);Encore une note. Assurez-vous que votre version ui-bootstrap prend en charge votre version angularjs actuelle. Sinon, vous pouvez obtenir d'autres erreurs comme templateProvider.
Pour plus d'informations, consultez ce lien:
http://www.ozkary.com/2016/01/angularjs-unknown-provider-modalprovider.html
J'espère que ça aide.
var ModalInstanceCtrl = ['$scope', '$modalInstance', function ($scope, $modalInstance, items) {
/* copy rest of example code here */
}];