2013-11-26 10 views
5

में एक "सशर्त" बैक बटन को कार्यान्वित करना मैं एक ember.js (संस्करण 1.2) आधारित मोबाइल एप्लिकेशन पर काम कर रहा हूं और मैं वैश्विक मेनू टॉगल/बैक बटन पैटर्न को लागू करने का सबसे बेवकूफ तरीका खोजने की कोशिश कर रहा हूं कई मोबाइल ऐप्स में आम है। विशेष रूप से, यह एक बटन जो फिक्स्ड-टॉप टूलबार के बाईं तरफ बैठता है, जो एक छिपे हुए दराज मुख्य मेनू को टॉगल करता है जब उपयोगकर्ता ऐप के घर/इंडेक्स व्यू पर होता है, हालांकि उप-मार्ग में जाने पर, बटन एक बैक प्रदर्शित करता है तीर, और जब क्लिक किया जाता है, तो यह उपयोगकर्ता को पहले देखे गए मार्ग पर वापस ले जाता है (या यदि पिछले इतिहास राज्य नहीं है, तो सूचकांक मार्ग पर वापस जाएं, यानी यदि उपयोगकर्ता ऐप लोड करने पर सीधे एक उप मार्ग में आया)।ember.js

Fyi, वर्तमान में मेरे पास रूट ऐप टेम्पलेट में फिक्स्ड-टॉप टूलबार और मेनू टॉगल/बैक बटन के साथ मेरा ऐप संरचित है। आदर्श रूप से यह कार्यक्षमता काम करेगी इससे कोई फर्क नहीं पड़ता कि कैसे मार्गों को transitionTo(), या {{#link-to}} सहायक, ect के माध्यम से परिवर्तित किया जा रहा है।

इसलिए अनिवार्य रूप से मैं जानना चाहता हूं कि एम्बर आंतरिक रूप से किसी भी प्रकार के सुलभ इतिहास/लॉग को ऐप के जीवनकाल के दौरान किस मार्ग में परिवर्तित कर दिया गया था, और यह भी कि कार्रवाई को सशर्त रूप से बदलने का सबसे अच्छा तरीका क्या होगा वर्तमान मार्ग के आधार पर टॉगल/बैक बटन प्रदर्शन करता है और इसका प्रदर्शन (उर्फ इसका आइकन)। और/या एम्बर के मार्ग परिवर्तन घटनाओं को सुनने का कोई तरीका है, इसलिए यदि आवश्यकता हो तो मैं उस इतिहास को स्वयं लागू कर सकता हूं?

उत्तर

11

मुझे बुरी खबरों के वाहक होने से नफरत है, लेकिन मुझे आपको फांसी छोड़ने से भी नफरत है।

एम्बर इतिहास का ट्रैक नहीं रखता है, इसके लिए सामान्य उपयोग नहीं है (विशेष रूप से जब ब्राउज़र आपके लिए इसका ट्रैक रखता है)।

सौभाग्य से आप एप्लिकेशन नियंत्रक में रूट परिवर्तनों की निगरानी कर सकते हैं, ऐसा कुछ आपको शुरू करना चाहिए (ध्यान दें कि मैंने एक अद्भुत समाधान का काम करने में समय नहीं लगाया जो पूरी तरह से काम करता है, सिर्फ आपको इसके लिए आवश्यक मूलभूत बातें दिखाता है, मैं 'आप कार्यप्रवाह है कि आप के लिए अच्छी तरह से काम)

http://emberjs.jsbin.com/IZAZemEP/1/edit

App.ApplicationController = Em.Controller.extend({ 
    history: [], 

    hasHistory: function(){ 
    return this.get('history.length')>1; 
    }.property('history.length'), 

    watchHistory: function(){ 
    this.get('history').pushObject(this.get('currentPath')); 
    }.observes('currentPath'), 

    actions: { 
    goBack: function(){ 
     // implement your own history popping that actually works ;) 
     if(this.get('hasHistory')){ 
     this.get('history').popObject(); 
     window.history.back(); 
     this.get('history').popObject(); // get rid of route change here, don't need it 
     } 
    } 
    } 
}); 
+0

हाँ यह पता लगाने सूचित करेंगे, मैं बहुत यकीन है कि एंबर की तरह कुछ भी नहीं था कि था कि बिल्ट-इन के बाद से मैं किसी भी नहीं मिल सका मार्गदर्शिका या एपीआई दस्तावेज़ों में कहीं भी इसका उल्लेख करें, लेकिन इससे पहले कि मैं इसके लिए कुछ लागू करने के साथ आगे बढ़ने से पहले यह सुनिश्चित करना चाहता हूं कि मी yself। आपका उदाहरण इसके लिए एक आदर्श प्रारंभिक बिंदु होना चाहिए, बहुत बहुत धन्यवाद! –

+4

गोबैक एक्शन में अगर मैं ऐप से किसी को लात मारने से बचने के लिए (!! this.get ('hasHistory')) {} else {// transitionTo index} में जोड़ दूंगा – ndreckshage