कोणीय जेएस गतिशील लोडिंग एक नियंत्रक

Question

मैंने आलसी लोडिंग के बारे में बहुत कुछ पढ़ा है, लेकिन मुझे $ रूटप्रोवाइडर का उपयोग करते समय समस्या का सामना करना पड़ रहा है।

मेरा लक्ष्य एक जावास्क्रिप्ट फ़ाइल लोड करना है जिसमें नियंत्रक होता है और इस नियंत्रक के लिए एक मार्ग जोड़ता है जिसे पहले लोड किया गया था।

मेरी जावास्क्रिप्ट फ़ाइल की सामग्री लोड करने के लिए जब कोणीय bootstap कहा जाता है

angular.module('demoApp.modules').controller('MouseTestCtrlA', ['$scope', function ($scope) { 
    console.log("MouseTestCtrlA"); 
    $scope.name = "MouseTestCtrlA"; 
}]); 

इस फ़ाइल में शामिल नहीं है। इसका मतलब है, मुझे फ़ाइल लोड करना है और इस नियंत्रक के लिए मार्ग बनाना है।

सबसे पहले, मैंने एक संकल्प फ़ंक्शन लिखना शुरू किया जिसे जावास्क्रिप्ट फ़ाइल लोड करना है। लेकिन मार्ग घोषणा में मेरी नियंत्रक पैरामीटर घोषित मुझे एक त्रुटि दिया:

'MouseTestCtrlA' है एक समारोह, नहीं मिला अपरिभाषित

यहाँ कॉल मैं स्थापित करने के लिए कोशिश कर रहा हूँ है:

demoApp.routeProvider.when(module.action, {templateUrl: module.template, controller: module.controller, resolve : {deps: function() /*load JS file*/} }); 

जो मैंने पढ़ा है, नियंत्रक पैरामीटर एक पंजीकृत नियंत्रक होना चाहिए

con ट्रोलर - {(स्ट्रिंग | फ़ंक्शन() =} - नियंत्रक एफएन जो स्ट्रिंग के रूप में पारित होने पर नव निर्मित स्कोप या पंजीकृत नियंत्रक के नाम से जुड़ा होना चाहिए।

तो मैं एक कारखाना लिखता हूं जो मेरी फाइल लोड करने में सक्षम होना चाहिए और फिर (वादा शैली!) मैं एक नया मार्ग घोषित करने की कोशिश करता हूं।

प्रयोग

ScriptLoader.load(module.dependencies).then(function() { 
    demoApp.routeProvider.when(module.action, {templateUrl: 'my-template', controller: module.controller}); 
}); 

स्क्रिप्ट लोडर

angular.module('demoApp.services').factory('ScriptLoader', ['$q', '$rootScope', function ($q, $rootScope) { 
     return { 
      load: function (dependencies) 
      { 
       var deferred = $q.defer(); 
       require(dependencies, function() { 
        $rootScope.$apply(function() { 
         deferred.resolve(); 
        }); 
       }); 
       return deferred.promise; 
      } 
     } 
    }]); 

समस्या:

यह मुझे नीचे जहां निर्भरता लोड करने के लिए जावास्क्रिप्ट फ़ाइलें 'रास्तों की एक सरणी है की तरह कुछ दे दिया

मुझे अभी भी यह जावास्क्रिप्ट त्रुटि है "'MouseTestCtrlA' एक फ़ंक्शन नहीं है, अपरिभाषित हो गया" जिसका अर्थ है कि कोणीय को नियंत्रक के रूप में 'MouseTestCtrlA' को हल नहीं किया जा सका।

क्या कोई इस बिंदु पर मेरी मदद कर सकता है?

Answer 1

इस आलेख को फिर से पढ़ना http://ify.io/lazy-loading-in-angularjs/ ने कोणीय ऐप के अंदर $contentProvider उदाहरण रखने का सुझाव दिया।

मैं अपने ऐप में इस कोड के साथ आया था।

angular.module("demoApp").controller('MouseTestCtrlA', fn); 

आशा इस मदद कर सकते हैं: js

demoApp.config(function ($controllerProvider) { 
    demoApp.controller = $controllerProvider.register; 
}); 

यह एक बाहरी जावास्क्रिप्ट फ़ाइल में होने की उम्मीद के रूप में मेरी नियंत्रक लिखने के लिए मुझे सक्षम बनाता है!