mdbottomsheet

Question

को बंद करने के लिए ड्रैग डाउन अक्षम करें मैं mdbottomsheet के इशारे को बंद करने के लिए ड्रैग डाउन को अक्षम करना चाहता हूं। मुझे स्क्रिप्ट पर चारों ओर एक काम मिला है लेकिन मुझे यकीन नहीं है कि कोड कहां रखा जाए। सहायता के लिए धन्यवाद।

Answer 1

जैसा कि आप कहते हैं कि कोणीय-सामग्री इसे अक्षम करने का कोई विकल्प प्रदान नहीं करती है, जाहिर है आपको इसके स्रोत कोड में परिवर्तन करना होगा।

अब, आपने यह नहीं बताया है कि आप इसे विशिष्ट स्थानों पर अक्षम करना चाहते हैं या नीचे हर जगह शीट के लिए ड्रैग-डाउन-टू-टर्न चालू करना चाहते हैं।

1) बाद के मामले में, यह काफी सरल होगा, क्योंकि केवल एक चीज जो आपको करने की ज़रूरत है, ईवेंट ईवेंट श्रोताओं को ड्रैग घटनाओं के लिए हटा दें। आप कोणीय material.js फ़ाइल का उपयोग करते हैं, यहाँ आप क्या कर सकते हैं:

समारोह BottomSheet (तत्व, माता पिता) का पता लगाएं। यह फ़ंक्शन मूल रूप से शीट को बंद करने वाले ड्रैग ईवेंट पंजीकृत करता है। हमें श्रोताओं को संलग्न करने की ज़रूरत नहीं है।

यह करने के लिए कम करें:

function BottomSheet(element, parent){ 
    return { 
     element: element, 
     cleanup: angular.noop 
    }; 
} 

सफाई समारोह मूल रूप से डी-पंजीकृत करता है खींचें event.This पर श्रोताओं जब bottomSheet के दायरे नष्ट हो जाता है समारोह कहा जाता है। न्यूनतम परिवर्तन करने के लिए, हमने क्लीनअप फ़ंक्शन को कुछ भी करने के लिए अभी कम कर दिया है।

2) यदि आप अपने नियंत्रक में शीट बनाने के दौरान एक विकल्प पास करने में सक्षम होना चाहते हैं, तो आप वही काम करते हैं, लेकिन सशर्त रूप से आपके द्वारा पारित विकल्प के आधार पर। क्योंकि मुझे लगता है आप कैसे कोणीय काम करता है पता है अभ्यस्त कोड लिखने, लेकिन यहां कदम:

=> अन्य विकल्पों के साथ एक बूलियन चर जोड़ें (टेम्पलेट, गुंजाइश, आदि।)। आइए इसे ड्रैगडाउन टू क्लोज़ पर कॉल करें।

=> डिफ़ॉल्ट इंजेक्टर फ़ंक्शन में MdbottomSheet के प्रदाता फ़ंक्शन के अंदर, इसे एक डिफ़ॉल्ट मान (सत्य/गलत) असाइन करें।

=> ऑनशो फ़ंक्शन के अंदर BottomSheet() के तत्काल के दौरान तत्व और अभिभावक के साथ इसे पास करें।

=> तो नीचे की शीट() में अब तीन तर्क होंगे - dragDownToClose नया होना।

=> जैसा कि हमने पूर्व मामले में किया था, मान को गलत होने पर किसी भी हैंडलर के बिना तत्व को वापस कर दें, और मूल कार्य को सत्य होने दें।

बेशक ऐसे कई तरीके हैं जिनमें आप वास्तव में इसे लागू कर सकते हैं। हालांकि, मुझे आशा है कि आपको विचार मिल जाएगा।

Answer 2

सबसे पहले, अपने नियंत्रक में $element इंजेक्ट करें। आप जानते हैं कि AngularJS $ तत्व क्या करता है, है ना?

फिर हम दोनों में जाना जाता है कि खींचें घटनाओं BottomSheet

parent.on('$md.dragstart', onDragStart) 
    .on('$md.drag', onDrag) 
    .on('$md.dragend', onDragEnd); 

में पंजीकृत हैं तो, सरल उपाय है: उन घटनाओं निकालें, उन घटनाओं को ओवरराइड ... बिना function BottomSheet, सही ओवरराइड?

  $element 
      .on('$md.dragstart', function (ev) { 
       return false; 
      }) 
      .on('$md.drag', function (ev) { 
       return false; 
      }) 
      .on('$md.dragend', function (ev) { 
       return false; 
      }); 

कुछ अभी भी गलत है! बैकड्रॉप अभी भी खींचने योग्य! तो, हम

var parent = $element.parent(); 
var backdrop = parent.find('md-backdrop'); 
backdrop 
       .on(blah blah blah 

ये है मामले में code आप के लिए

Answer 3

पूछ रहे हैं इस नहीं दूँगी उपयोगकर्ता भी साथ नीचे चादर बंद आप कोशिश कर सकते हैं

$mdBottomSheet.show({ 
         template: *yourTemplate*, 
         clickOutsideToClose:false 
        }) 

पृष्ठभूमि के लिए भी ऐसा ही खींचें या बाहर क्लिक करें।