फ़ाइल डाउनलोड करने के लिए कोणीय जेएस तरीका और $ संसाधन

Question

का उपयोग कर लोडिंग स्क्रीन दिखाएं मैं लोडिंग स्क्रीन दिखाने के लिए कोणीय जेएस का उपयोग कर रहा हूं। यह फ़ाइल डाउनलोड करने के लिए आरईएसटी सेवा को छोड़कर सभी आरईएसटी सेवा कॉल के लिए काम करता है। मैं समझता हूं कि यह क्यों काम नहीं कर रहा है क्योंकि डाउनलोड के लिए मैं $ संसाधन का उपयोग कर कोई सेवा कॉल नहीं कर रहा हूं; इसके बजाय मैं फ़ाइल डाउनलोड करने के लिए सामान्य दृष्टिकोण का उपयोग कर रहा हूं इसलिए कोणीय जेएस कोड का सेवा अनुरोध शुरू/खत्म करने पर कोई नियंत्रण नहीं है। मैंने इस आरईएसटी सेवा को हिट करने के लिए $ संसाधन का उपयोग करने की कोशिश की, हालांकि मुझे इस सेवा से डेटा मिल रहा है और इस मामले में लोडिंग स्क्रीन ठीक काम कर रही थी, हालांकि यह सुनिश्चित नहीं है कि उपयोगकर्ता को कोणीय तरीके से डाउनलोड करने के लिए इस डेटा का उपयोग कैसे किया जाए। निम्नलिखित आवश्यक विवरण हैं। कृपया मदद करे।

दृष्टिकोण 1 का उपयोग कर आइफ्रेम दृष्टिकोण:

/*Download file */ 
      scope.downloadFile = function (fileId) { 
       //Show loading screen. (Somehow it is not working) 
       scope.loadingProjectFiles=true; 
       var fileDownloadURL = "/api/files/" + fileId + "/download"; 
       downloadURL(fileDownloadURL); 
       //Hide loading screen 
       scope.loadingProjectFiles=false; 
      }; 

      var $idown; // Keep it outside of the function, so it's initialized once. 
      var downloadURL = function (url) { 
       if ($idown) { 
        $idown.attr('src', url); 
       } else { 
        $idown = $('<iframe>', { id: 'idown', src: url }).hide().appendTo('body'); 
       } 
      }; 

दृष्टिकोण 2 का उपयोग $ संसाधन (स्क्रीन पर डेटा प्रदर्शित करने के लिए कैसे डाउनलोड करने के लिए सुनिश्चित नहीं हैं)

/*Download file */ 
      scope.downloadFile = function (fileId) { 
       //Show loading screen (Here loading screen works). 
       scope.loadingProjectFiles=true;     
        //File download object 
        var fileDownloadObj = new DownloadFile(); 
       //Make server call to create new File 
        fileDownloadObj.$get({ fileid: fileid }, function (response) { 
         //Q? How to use the response data to display on UI as download popup 
         //Hide loading screen 
         scope.loadingProjectFiles=false; 
        }); 

      }; 

Answer 1

यहाँ कुछ विचार के लिए है रहे हैं दूसरा दृष्टिकोण, डाउनलोड करने के बाद आप उपयोगकर्ता को एक लिंक के साथ प्रस्तुत कर सकते हैं:

• With a "data url"। शायद for large files एक अच्छा विचार नहीं है।
• "फाइल सिस्टम: mydownload.zip" जैसे यूआरएल के साथ आपको फ़ाइल को फाइल सिस्टम एपीआई के साथ सहेजना होगा। आप html5rocks

Answer 2

पर कुछ प्रेरणा मिल सकता है यह $ संसाधन सेवा के साथ सही पैटर्न है:

scope.downloadFile = function (fileId) { 
    //Show loading screen (Here loading screen works). 
    scope.loadingProjectFiles=true;     
    var FileResource = $resource('/api/files/:idParam', {idParam:'@id'}); 
    //Make server call to retrieve a file 
    var yourFile = FileResource.$get({ id: fileId }, function() { 
     //Now (inside this callback) the response data is loaded inside the yourFile variable 
     //I know it's an ugly pattern but that's what $resource is about... 
     DoSomethingWithYourFile(yourFile); 
     //Hide loading screen 
     scope.loadingProjectFiles=false; 
    }); 
}; 

मैं आपसे सहमत हूँ कि यह एक अजीब पैटर्न है और जहां से डाउनलोड अन्य APIs के अलग है डेटा कॉलबैक फ़ंक्शन में पैरामीटर को असाइन किया जाता है, इसलिए आपका भ्रम।

नामों और पैरामीटर के मामलों पर ध्यान दें, और देखें कि यहां दो मैपिंग शामिल हैं, कॉलर के बीच एक $ संसाधन ऑब्जेक्ट और ऑब्जेक्ट के बीच, और दूसरा इस ऑब्जेक्ट और यूआरएल के बीच यह वास्तविक डेटा डाउनलोड करने के लिए संघर्ष करता है।