मुझे पता है कि यह एक पुराना सवाल है, लेकिन मैं हाल ही में ऐसा करने के विकल्पों पर विचार कर रहा था, इसलिए मैंने सोचा कि मैं अपने निष्कर्षों को यहां रखूं क्योंकि यह किसी के लिए भी उपयोगी है।
ज्यादातर मामलों में, अगर यूआई की स्थिति या एप्लिकेशन के आंतरिक कामकाज के साथ बातचीत करने के लिए बाहरी विरासत कोड की आवश्यकता होती है, तो एक सेवा उन परिवर्तनों को दूर करने के लिए उपयोगी हो सकती है। यदि कोई बाहरी कोड आपके कोणीय नियंत्रक, घटक या निर्देश के साथ सीधे संपर्क कर रहा है, तो आप अपने ऐप को अपने विरासत कोड के साथ भारी मात्रा में जोड़ रहे हैं जो कि बुरी खबर है।
जो मैंने अपने मामले में उपयोग किया था, वह ब्राउज़र सुलभ ग्लोबल्स (यानी विंडो) और इवेंट हैंडलिंग का एक संयोजन है। मेरे कोड में एक स्मार्ट फॉर्म जनरेशन इंजन है जिसके लिए CMS से JSON आउटपुट की आवश्यकता होती है जो फॉर्म को initiliase करता है। यहाँ मैंने क्या किया है:
function FormSchemaService(DOM) {
var conf = DOM.conf;
// This event is the point of integration from Legacy Code
DOM.addEventListener('register-schema', function (e) {
registerSchema(DOM.conf);
}, false);
// service logic continues ....
अपेक्षित रूप से कोणीय इंजेक्टर का उपयोग करके फॉर्म स्कीमा सेवा बनाई जाती है:
angular.module('myApp.services').
service('FormSchemaService', ['$window' , FormSchemaService ])
और मेरे नियंत्रकों में: फ़ंक्शन () {'उपयोग सख्त';
angular.module('myApp').controller('MyController', MyController);
MyEncapsulatorController.$inject = ['$scope', 'FormSchemaService'];
function MyController($scope, formSchemaService) {
// using the already configured formSchemaService
formSchemaService.buildForm();
अब तक यह शुद्ध कोणीय और जावास्क्रिप्ट सेवा उन्मुख प्रोग्रामिंग है। लेकिन विरासत एकीकरण यहाँ आता है:
<script type="text/javascript">
(function(app){
var conf = app.conf = {
'fields': {
'field1: { // field configuration }
}
} ;
app.dispatchEvent(new Event('register-schema'));
})(window);
</script>
जाहिर है कि हर दृष्टिकोण में यह गुण और कमियां हैं। इस दृष्टिकोण का लाभ और उपयोग आपके UI पर निर्भर करता है। पहले से सुझाए गए दृष्टिकोण मेरे मामले में काम नहीं करते हैं क्योंकि मेरे फॉर्म स्कीमा और विरासत कोड में कोणीय scopes का कोई नियंत्रण और ज्ञान नहीं है। इसलिए angular.element('element-X').scope();
यदि हम आसपास के स्कोप को बदलते हैं, तो संभवत: मेरे ऐप को कॉन्फ़िगर करने के आधार पर ऐप को तोड़ सकता है। लेकिन अगर आपको ऐप के बारे में पता चल गया है और वह इस पर भरोसा नहीं कर सकता है कि यह अक्सर नहीं बदल रहा है, तो जो पहले सुझाया गया है वह व्यवहार्य दृष्टिकोण है।
उम्मीद है की यह मदद करेगा। किसी भी प्रतिक्रिया का भी स्वागत है।
var injector = angular.injector(['ng', 'MyApp']);। ऐसा करने से आपको एक नया संदर्भ और एक डुप्लिकेट मिलेगाmyService। इसका मतलब है कि आप सेवा और मॉडल के दो उदाहरणों के साथ समाप्त हो जाएंगे और गलत स्थान पर डेटा जोड़ देंगे। आपको इसके बजाय एप्लिकेशन के भीतर एक तत्व का उपयोग करना चाहिएangular.element('#ng-app').injector(['ng', 'MyApp'])। इस बिंदु पर आप तब मॉडल परिवर्तन को लपेटने के लिए $ लागू का उपयोग कर सकते हैं।