Я продовжую отримувати цю помилку, коли я намагаюся реалізувати Модальне вікно завантаження. Що може бути причиною цього? Я скопіював / вставлю все з http://angular-ui.github.io/bootstrap/#/modal тут.
Я продовжую отримувати цю помилку, коли я намагаюся реалізувати Модальне вікно завантаження. Що може бути причиною цього? Я скопіював / вставлю все з http://angular-ui.github.io/bootstrap/#/modal тут.
Відповіді:
Така помилка виникає, коли ви пишете в залежність від контролера, служби тощо, і ви не створили та не включили цю залежність.
У цьому випадку $modal
це не відома служба. Здається, ви не перейшли в ui-bootstrap як залежність при завантаженні кутового. angular.module('myModule', ['ui.bootstrap']);
Крім того, не забудьте використовувати останню версію ui-bootstrap (0.6.0), щоб бути безпечною.
Помилка введена у версії 0.5.0, але оновлення до 0.6.0 робить доступною модальну службу $. Отже, оновіть до версії 0.6.0 і обов'язково вимагайте ui.boostrap при реєстрації свого модуля.
Відповідь на ваш коментар: Ось як ви вводите залежність модуля.
<!-- 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) {
});
$modal
Служба була перейменована в $uibModal
.
Приклад використання $ 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 років (це вже тоді не було б проблемою) :
Проміжок імен змінився - ви можете наткнутися на це повідомлення після оновлення до нової версії bootstrap-ui ; вам потрібно звернутися до $uibModal
& $uibModalInstance
.
Просто додаткова бічна примітка до проблеми, яку я також зазнав сьогодні: у мене була подібна помилка "Невідомий провайдер: $ aProvider", коли я ввімкнув мінімізацію / невдачу мого вихідного коду.
Як уже згадувалося в посібнику з кутових документів (параграф: "Примітка про мінімізацію"), ви повинні використовувати синтаксис масиву, щоб переконатися, що посилання зберігаються правильно для введення залежності:
var PhoneListCtrl = ['$scope', '$http', function($scope, $http) { /* constructor body */ }];
Для прикладу Angular UI Bootstrap ви згадаєте, що вам слід замінити це:
var ModalInstanceCtrl = function ($scope, $modalInstance, items) {
/* ...example code.. */
}
з цим позначенням масиву:
var ModalInstanceCtrl = ['$scope', '$modalInstance', 'items', function ($scope, $modalInstance, items) {
/* copy rest of example code here */
}];
З цією зміною мій мінімізований кутовий модульний код вікна інтерфейсу знову став функціональним.
Очевидною відповіддю на помилку постачальника є відсутність залежності при оголошенні модуля, як у випадку додавання ui-bootstrap. Єдине, чого багато хто з нас не враховує, - це суттєві зміни під час оновлення до нового випуску. Так, слід працювати, а не викликати помилку постачальника:
var app = angular.module('app', ['ui.router', 'ngRoute', 'ui.bootstrap']);
app.factory("$svcMessage", ['$modal', svcMessage]);
За винятком випадків, коли ми використовуємо нову версію ui-boostrap. Модальний постачальник зараз визначається як:
.provider('$uibModal', function() {
var $modalProvider = {
options: {
animation: true,
backdrop: true, //can also be false or 'static'
keyboard: true
},
Порада тут, як тільки ми переконаємося, що залежності включені, і ми все-таки отримаємо цю помилку, ми повинні перевірити, яку версію бібліотеки JS ми використовуємо. Ми також можемо швидко здійснити пошук і побачити, чи існує цей постачальник у файлі.
У цьому випадку модальний постачальник повинен бути таким:
app.factory("$svcMessage", ['$uibModal', svcMessage]);
Ще одна примітка. Переконайтеся, що версія ui-bootstrap підтримує поточну версію angularjs. Якщо ні, ви можете отримати інші помилки, такі як templateProvider.
Для інформації перевірте це посилання:
http://www.ozkary.com/2016/01/angularjs-unknown-provider-modalprovider.html
сподіваюся, що це допомагає.
var ModalInstanceCtrl = ['$scope', '$modalInstance', function ($scope, $modalInstance, items) {
/* copy rest of example code here */
}];