मैं इस त्रुटि को प्राप्त कर रहा हूं क्योंकि मैं बूटस्ट्रैप मोडल विंडो को लागू करने की कोशिश कर रहा हूं। इसका कारण क्या हो सकता है? मैंने यहाँ http://angular-ui.github.io/bootstrap/#/modal से सब कुछ कॉपी / पेस्ट किया है।
मैं इस त्रुटि को प्राप्त कर रहा हूं क्योंकि मैं बूटस्ट्रैप मोडल विंडो को लागू करने की कोशिश कर रहा हूं। इसका कारण क्या हो सकता है? मैंने यहाँ http://angular-ui.github.io/bootstrap/#/modal से सब कुछ कॉपी / पेस्ट किया है।
जवाबों:
इस तरह की त्रुटि तब होती है जब आप किसी नियंत्रक, सेवा, आदि के लिए निर्भरता में लिखते हैं, और आपने उस निर्भरता को बनाया या शामिल नहीं किया है।
इस मामले में, $modal
एक ज्ञात सेवा नहीं है। ऐसा लगता है कि आप ui-बूटस्ट्रैप में एक निर्भरता के रूप में पास नहीं हुए थे जब बूटस्ट्रैपिंग कोणीय। angular.module('myModule', ['ui.bootstrap']);
इसके अलावा, सुनिश्चित करें कि आप यूआई-बूटस्ट्रैप (0.6.0) के नवीनतम संस्करण का उपयोग कर रहे हैं, बस सुरक्षित रहने के लिए।
संस्करण 0.5.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 साल बाद (यह उस समय समस्या नहीं होगी) :
नेमस्पेसिंग बदल गई है - आप बूटस्ट्रैप-यूआई के एक नए संस्करण में अपग्रेड करने के बाद इस संदेश को रोक सकते हैं ; आपको $uibModal
& को संदर्भित करना होगा $uibModalInstance
।
जब मैंने आज भी एक समस्या के लिए एक अतिरिक्त पक्ष नोट किया था: मेरे पास एक समान त्रुटि थी "अज्ञात प्रदाता: $ aProvider" जब मैं अपने स्रोत कोड के संशोधन / खराबी पर बदल गया ।
जैसा कि कोणीय डॉक्स ट्यूटोरियल (पैराग्राफ: "ए नोट ऑन मिनिफिकेशन") में उल्लेख किया गया है, आपको यह सुनिश्चित करने के लिए कि संदर्भ निर्भरता इंजेक्शन के लिए सही ढंग से रखे गए हैं, सरणी सरणी सिंटैक्स का उपयोग करना होगा:
var PhoneListCtrl = ['$scope', '$http', function($scope, $http) { /* constructor body */ }];
आपके द्वारा उल्लिखित कोणीय UI बूटस्ट्रैप उदाहरण के लिए आपको इसे प्रतिस्थापित करना चाहिए:
var ModalInstanceCtrl = function ($scope, $modalInstance, items) {
/* ...example code.. */
}
इस सरणी संकेतन के साथ:
var ModalInstanceCtrl = ['$scope', '$modalInstance', 'items', function ($scope, $modalInstance, items) {
/* copy rest of example code here */
}];
उस परिवर्तन के साथ मेरा छोटा कोणीय UI मोडल विंडो कोड फिर से कार्यशील हो गया।
प्रदाता की त्रुटि के लिए स्पष्ट उत्तर एक निर्भरता है जब एक मॉड्यूल को घोषित किया जाता है जैसे कि ui-बूटस्ट्रैप को जोड़ने के मामले में। नई रिलीज़ के लिए अपग्रेड करते समय हममें से बहुत सी चीज़ों का कोई तोड़ नहीं है। हां, निम्नलिखित को काम करना चाहिए और प्रदाता की त्रुटि नहीं बढ़ानी चाहिए:
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
},
यहाँ एक बार सलाह है कि हम यह सुनिश्चित कर लें कि निर्भरताएँ शामिल हैं और हमें अभी भी यह त्रुटि मिली है, हमें यह जाँचना चाहिए कि जेएस लाइब्रेरी का कौन सा संस्करण हम उपयोग कर रहे हैं। हम त्वरित खोज भी कर सकते हैं और देख सकते हैं कि क्या फ़ाइल में वह प्रदाता मौजूद है।
इस मामले में, मोडल प्रदाता अब इस प्रकार होना चाहिए:
app.factory("$svcMessage", ['$uibModal', svcMessage]);
एक और नोट। सुनिश्चित करें कि आपका ui-bootstrap संस्करण आपके वर्तमान कोणीय संस्करणों का समर्थन करता है। यदि नहीं, तो आपको टेम्पलेटप्रोवाइडर जैसी अन्य त्रुटियाँ मिल सकती हैं।
जानकारी के लिए इस लिंक को देखें:
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 */
}];