Sigo recibiendo este error mientras intento implementar la ventana modal de arranque. ¿Cuál podría ser la causa? He copiado / pegado todo de http://angular-ui.github.io/bootstrap/#/modal aquí.
Sigo recibiendo este error mientras intento implementar la ventana modal de arranque. ¿Cuál podría ser la causa? He copiado / pegado todo de http://angular-ui.github.io/bootstrap/#/modal aquí.
Respuestas:
Este tipo de error ocurre cuando escribe en una dependencia para un controlador, servicio, etc., y no ha creado ni incluido esa dependencia.
En este caso, $modalno es un servicio conocido. Parece que no pasó ui-bootstrap como una dependencia al arrancar angular. angular.module('myModule', ['ui.bootstrap']);Además, asegúrese de estar utilizando la última versión de ui-bootstrap (0.6.0), solo para estar seguro.
El error se produce en la versión 0.5.0, pero la actualización a 0.6.0 hace que el servicio $ modal esté disponible. Por lo tanto, actualice a la versión 0.6.0 y asegúrese de requerir ui.boostrap al registrar su módulo.
En respuesta a su comentario: así es como inyecta una dependencia de módulo.
<!-- 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) {
});Se $modalha cambiado el nombre del servicio a $uibModal.
Ejemplo usando $ 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 años después (este no habría sido el problema en ese momento) :
El espacio de nombres ha cambiado; es posible que se encuentre con este mensaje después de actualizar a una versión más reciente de bootstrap-ui ; debe consultar $uibModal& $uibModalInstance.
Solo una nota adicional para un problema que también experimenté hoy: tuve un error similar "Proveedor desconocido: $ aProvider" cuando encendí la minificación / uglify de mi código fuente.
Como se menciona en el tutorial de Angular docs (párrafo: "Una nota sobre la minificación") , debe usar la sintaxis de la matriz para asegurarse de que las referencias se mantengan correctamente para la inyección de dependencia:
var PhoneListCtrl = ['$scope', '$http', function($scope, $http) { /* constructor body */ }];Para el ejemplo de Bootstrap de interfaz de usuario angular , menciona que debería reemplazar esto:
var ModalInstanceCtrl = function ($scope, $modalInstance, items) {
/* ...example code.. */
}con esta notación de matriz:
var ModalInstanceCtrl = ['$scope', '$modalInstance', 'items', function ($scope, $modalInstance, items) {
/* copy rest of example code here */
}];Con ese cambio, mi código de ventana modal de interfaz de usuario angular minificado volvió a funcionar.
La respuesta obvia para el error del proveedor es la dependencia que falta al declarar un módulo, como en el caso de agregar ui-bootstrap. Lo único que muchos de nosotros no tenemos en cuenta son los cambios importantes al actualizar a una nueva versión. Sí, lo siguiente debería funcionar y no generar el error del proveedor:
var app = angular.module('app', ['ui.router', 'ngRoute', 'ui.bootstrap']);
app.factory("$svcMessage", ['$modal', svcMessage]);Excepto cuando estemos usando una nueva versión de ui-boostrap. El proveedor modal ahora se define como:
.provider('$uibModal', function() {
var $modalProvider = {
options: {
animation: true,
backdrop: true, //can also be false or 'static'
keyboard: true
},El consejo aquí es que una vez que nos hayamos asegurado de que las dependencias estén incluidas y todavía recibamos este error, deberíamos verificar qué versión de la biblioteca JS estamos usando. También podríamos hacer una búsqueda rápida y ver si ese proveedor existe en el archivo.
En este caso, el proveedor modal debería ser ahora el siguiente:
app.factory("$svcMessage", ['$uibModal', svcMessage]);Una nota más. Asegúrese de que su versión de ui-bootstrap sea compatible con su versión actual de angularjs. De lo contrario, puede obtener otros errores como templateProvider.
Para obtener información, consulte este enlace:
http://www.ozkary.com/2016/01/angularjs-unknown-provider-modalprovider.html
Espero eso ayude.
var ModalInstanceCtrl = ['$scope', '$modalInstance', function ($scope, $modalInstance, items) {
/* copy rest of example code here */
}];