Continuo a ricevere questo errore mentre cerco di implementare la finestra Modal bootstrap. Quale potrebbe essere la causa? Ho copiato / incollato tutto da http://angular-ui.github.io/bootstrap/#/modal qui.
Continuo a ricevere questo errore mentre cerco di implementare la finestra Modal bootstrap. Quale potrebbe essere la causa? Ho copiato / incollato tutto da http://angular-ui.github.io/bootstrap/#/modal qui.
Risposte:
Questo tipo di errore si verifica quando si scrive in una dipendenza per un controller, un servizio e così via e non è stata creata o inclusa tale dipendenza.
In questo caso, $modalnon è un servizio noto. Sembra che tu non sia passato in ui-bootstrap come dipendenza durante l'avvio di angular. angular.module('myModule', ['ui.bootstrap']);Inoltre, assicurati di utilizzare l'ultima versione di ui-bootstrap (0.6.0), solo per sicurezza.
L'errore viene generato nella versione 0.5.0, ma l'aggiornamento alla 0.6.0 rende disponibile il servizio $ modal. Quindi, aggiorna alla versione 0.6.0 e assicurati di richiedere ui.boostrap quando registri il tuo modulo.
Risposta al tuo commento: questo è il modo in cui inietti una dipendenza dal modulo.
<!-- 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) {
});Il $modalservizio è stato rinominato $uibModal.
Esempio utilizzando $ 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 anni dopo (questo non sarebbe stato il problema all'epoca) :
Lo spazio dei nomi è cambiato: potresti imbatterti in questo messaggio dopo l'aggiornamento a una versione più recente di bootstrap-ui ; è necessario fare riferimento a $uibModal& $uibModalInstance.
Solo una nota a margine extra per un problema che ho riscontrato anche oggi: ho riscontrato un errore simile "Provider sconosciuto: $ aProvider" quando ho attivato la minimizzazione / uglify del mio codice sorgente.
Come menzionato nel tutorial di Angular docs (paragrafo: "A Note on Minification") devi usare la sintassi dell'array per assicurarti che i riferimenti siano mantenuti correttamente per l'inserimento delle dipendenze:
var PhoneListCtrl = ['$scope', '$http', function($scope, $http) { /* constructor body */ }];Per l' esempio Bootstrap dell'interfaccia utente angolare che hai menzionato, dovresti sostituire questo:
var ModalInstanceCtrl = function ($scope, $modalInstance, items) {
/* ...example code.. */
}con questa notazione di matrice:
var ModalInstanceCtrl = ['$scope', '$modalInstance', 'items', function ($scope, $modalInstance, items) {
/* copy rest of example code here */
}];Con questa modifica il mio codice della finestra modale dell'interfaccia utente angolare miniato era di nuovo funzionante.
La risposta ovvia per l'errore del provider è la dipendenza mancante quando si dichiara un modulo come nel caso dell'aggiunta di ui-bootstrap. L'unica cosa di cui molti di noi non tengono conto sono le modifiche sostanziali durante l'aggiornamento a una nuova versione. Sì, quanto segue dovrebbe funzionare e non generare l'errore del provider:
var app = angular.module('app', ['ui.router', 'ngRoute', 'ui.bootstrap']);
app.factory("$svcMessage", ['$modal', svcMessage]);Tranne quando stiamo usando una nuova versione di ui-boostrap. Il provider modale ora è definito come:
.provider('$uibModal', function() {
var $modalProvider = {
options: {
animation: true,
backdrop: true, //can also be false or 'static'
keyboard: true
},Il consiglio qui è che una volta che ci siamo assicurati che le dipendenze siano incluse e otteniamo ancora questo errore, dovremmo controllare quale versione della libreria JS stiamo usando. Potremmo anche fare una rapida ricerca e vedere se quel provider esiste nel file.
In questo caso, il provider modale dovrebbe ora essere il seguente:
app.factory("$svcMessage", ['$uibModal', svcMessage]);Ancora una nota. Assicurati che la tua versione ui-bootstrap supporti la tua attuale versione di angularjs. In caso contrario, potresti ricevere altri errori come templateProvider.
Per informazioni controllare questo link:
http://www.ozkary.com/2016/01/angularjs-unknown-provider-modalprovider.html
spero che sia d'aiuto.
var ModalInstanceCtrl = ['$scope', '$modalInstance', function ($scope, $modalInstance, items) {
/* copy rest of example code here */
}];