Wciąż otrzymuję ten błąd, gdy próbuję zaimplementować okno modalne ładowania początkowego. Co może być tego przyczyną? Skopiowałem / wkleiłem wszystko z http://angular-ui.github.io/bootstrap/#/modal tutaj.
Wciąż otrzymuję ten błąd, gdy próbuję zaimplementować okno modalne ładowania początkowego. Co może być tego przyczyną? Skopiowałem / wkleiłem wszystko z http://angular-ui.github.io/bootstrap/#/modal tutaj.
Odpowiedzi:
Ten rodzaj błędu występuje, gdy piszesz w zależności dla kontrolera, usługi itp., A nie utworzono ani nie uwzględniono tej zależności.
W tym przypadku $modalnie jest to znana usługa. Wygląda na to, że nie przekazałeś ui-bootstrap jako zależności podczas ładowania początkowego angular. angular.module('myModule', ['ui.bootstrap']);Upewnij się również, że używasz najnowszej wersji ui-bootstrap (0.6.0), na wszelki wypadek.
Błąd jest zgłaszany w wersji 0.5.0, ale aktualizacja do 0.6.0 powoduje, że usługa modalna $ jest dostępna. Tak więc zaktualizuj do wersji 0.6.0 i pamiętaj, aby podczas rejestracji modułu wymagać ui.boostrap.
Odpowiadanie na komentarz: w ten sposób wstrzykujesz zależność od modułu.
<!-- 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) {
});Nazwa $modalusługi została zmieniona na $uibModal.
Przykład użycia $ 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 lat później (wtedy nie byłby to problem) :
Przestrzeń nazw uległa zmianie - możesz natknąć się na ten komunikat po aktualizacji do nowszej wersji bootstrap-ui ; musisz odwołać się do $uibModal& $uibModalInstance.
Dodatkowa uwaga dotycząca problemu, którego również dzisiaj doświadczyłem: miałem podobny błąd „Nieznany dostawca: $ aProvider”, gdy włączałem minifikację / uglify kodu źródłowego.
Jak wspomniano w samouczku dokumentacji Angular (akapit: „Uwaga na temat minifikacji”) , musisz użyć składni tablicowej, aby upewnić się, że odwołania są zachowane poprawnie w przypadku wstrzykiwania zależności:
var PhoneListCtrl = ['$scope', '$http', function($scope, $http) { /* constructor body */ }];W przypadku przykładu Angular UI Bootstrap , o którym wspominasz, powinieneś zastąpić to:
var ModalInstanceCtrl = function ($scope, $modalInstance, items) {
/* ...example code.. */
}z taką notacją tablicową:
var ModalInstanceCtrl = ['$scope', '$modalInstance', 'items', function ($scope, $modalInstance, items) {
/* copy rest of example code here */
}];Po tej zmianie mój zminimalizowany kod okna modalnego Angular UI znów działał.
Oczywistą odpowiedzią na błąd dostawcy jest brak zależności przy deklarowaniu modułu, jak w przypadku dodawania ui-bootstrap. Jedyną rzeczą, której wielu z nas nie bierze pod uwagę, są istotne zmiany podczas aktualizacji do nowej wersji. Tak, poniższe powinny działać i nie powodować błędu dostawcy:
var app = angular.module('app', ['ui.router', 'ngRoute', 'ui.bootstrap']);
app.factory("$svcMessage", ['$modal', svcMessage]);Z wyjątkiem sytuacji, gdy używamy nowej wersji ui-boostrap. Dostawca modalny jest teraz zdefiniowany jako:
.provider('$uibModal', function() {
var $modalProvider = {
options: {
animation: true,
backdrop: true, //can also be false or 'static'
keyboard: true
},Radzimy tutaj, gdy upewnimy się, że zależności są uwzględnione i nadal otrzymujemy ten błąd, powinniśmy sprawdzić, jakiej wersji biblioteki JS używamy. Moglibyśmy również przeprowadzić szybkie wyszukiwanie i sprawdzić, czy ten dostawca istnieje w pliku.
W takim przypadku dostawca modalny powinien teraz wyglądać następująco:
app.factory("$svcMessage", ['$uibModal', svcMessage]);Jeszcze jedna uwaga. Upewnij się, że Twoja wersja ui-bootstrap obsługuje aktualną wersję angularjs. Jeśli nie, możesz otrzymać inne błędy, takie jak templateProvider.
Aby uzyskać informacje, sprawdź ten link:
http://www.ozkary.com/2016/01/angularjs-unknown-provider-modalprovider.html
mam nadzieję, że to pomoże.
var ModalInstanceCtrl = ['$scope', '$modalInstance', function ($scope, $modalInstance, items) {
/* copy rest of example code here */
}];