2012-01-09 17 views
13

मैं jQuery मोबाइल के साथ काम करने वाले नॉकआउट जेएस प्राप्त करने की कोशिश कर रहा हूं और पृष्ठों के बीच चलते समय कुछ समस्याएं मार रहा हूं।एकाधिक दृश्य मॉडल के साथ काम कर रहे नॉकआउटज

मैं जेक्यूएम में पेज संक्रमणों को आजमाकर रखना चाहता हूं और इसलिए मैं एकाधिक पेज विकल्प (एक एचटीएमएल फाइल में परिभाषित एकाधिक पेज) का उपयोग करना चाहता हूं या डीओएम में अतिरिक्त पेजों को डिफ़ॉल्ट AJAX में विस्तृत रूप से लोड करना चाहता हूं दस्तावेज के व्यवहार खंड।

JQM Page Transition Documentation

मैं प्रत्येक पर एक अलग दृश्य मॉडल के साथ दोनों काम कर रहे दो अलग-अलग Knockoutjs पृष्ठों की है। जब तक मैं उन्हें JQM के माध्यम से एक साथ जोड़ने का प्रयास नहीं करता तब तक दोनों पृष्ठ पूरी तरह से काम करते हैं।

जो भी पृष्ठ मैं लोड करने का प्रयास करता हूं मुझे दूसरे पृष्ठ पर मैपिंग से संबंधित त्रुटि मिलती है। मैं केवल यह मान सकता हूं कि दोनों पेज एकल डोम में लोड किए गए हैं और जब नॉकआउट बाइंडिंग लागू करता है तो यह उन गुणों की तलाश में है जो मौजूद नहीं हैं।

मैंने इसे प्रदर्शित करने के लिए jsFiddle बनाने का प्रयास किया है।

JQM - Knockout Fiddle

मैं दोनों JQM के लिए नया हूँ और नॉकआउट इसलिए किसी भी मदद की सराहना की। अगर मैं पूरी तरह से गलत दृष्टिकोण ले रहा हूं तो मैं किसी को सही दिशा में इंगित करने की सराहना करता हूं।

क्या मैं पूरी साइट के लिए एक व्यूमोडेल का उपयोग करने का बेहतर प्रयास करूँगा? यदि नहीं, तो मैं जेक्यूएम के साथ नॉकआउटज का उपयोग कैसे कर सकता हूं?

+4

धन्यवाद जैस्पर। वास्तव में सहायक ..... – fluent

+2

हमम जैस्पर, Google खोज ने मुझे यहां लाया। –

+0

मैंने सोचा था कि एलएमजीटीएफई एसओ, जैस्पर में सवालों के जवाब देने का कोई तरीका नहीं है? – Illuminati

उत्तर

22

पूरी साइट के लिए एक "मास्टर" व्यू मॉडल स्वीकार्य होगा।

var masterViewModel = { 
    viewModelOne: ..., 
    viewModelTwo: ... 
} 

वैकल्पिक रूप से, आप कॉल कर सकते हैं .applyBindings, अलग-अलग तत्वों को लागू करने के लिए बाइंडिंग ओवरलोड नहीं बल्कि पूरे डोम से:

ko.applyBindings(new modelOne("Test", "One"), $("#one")[0]); 
ko.applyBindings(new modelTwo("Test", "Two"), $("#two")[0]); 

व्यक्तिगत रूप से, मैं था उसके बाद, आप कुछ इस तरह कर सकता है दूसरे दृष्टिकोण की सिफारिश करें।

+0

ग्रेट सामान। क्या इसका कोई प्रदर्शन प्रभाव पड़ता है क्योंकि मैं एक दृश्य मॉडल को बनाने और बाध्यकारी प्रतीत होता हूं जो पूरी तरह से अनावश्यक है? – fluent

+0

अगर कोई और दिलचस्पी लेता है तो बेवकूफ़ अपडेट करें। http://jsfiddle.net/npJZM/10/ – fluent

+2

निश्चित रूप से, एक प्रदर्शन ओवरहेड होने की संभावना है कि आपको उस पृष्ठ को तब तक दूसरे पृष्ठ पर बाइंडिंग लागू करने की आवश्यकता नहीं है जब तक आप उस पृष्ठ को नहीं दिखाते। इसे ऑफ़सेट करने के लिए, आप दूसरे div के लिए केवल दूसरे div के लिए bappings का आविष्कार करने का प्रयास कर सकते हैं। –

1

मैं वर्तमान में jQuery मोबाइल 1.3.1 और नॉकआउट 2.2.1 का उपयोग कर रहा हूं और इस समस्या के लिए (उम्मीदपूर्वक) स्थायी समाधान खोजने से पहले कई दृष्टिकोणों की कोशिश की। बाध्यकारी लागू करने के लिए जब हार्ड भाग का पता लगा रहा है। जब मैंने jQuery के तैयार फ़ंक्शन का उपयोग किया, तो यह काम नहीं किया। मुझे दस्तावेज़ तैयार फ़ंक्शन के बजाय पेजिनिट इवेंट कॉलबैक पर बाध्य करने के लिए jQM documentation में मिला। हालांकि, इस कॉलबैक को से निकाल दिया गया है हर बार एक पृष्ठ को पहली बार प्रस्तुत किया जाता है, यदि आपके पास 5 जेक्यूएम पेज हैं, तो इसे 5 बार निकाल दिया जा सकता है और आपको केवल एक बार केओ बाइंडिंग लागू करना होगा। और बाइंडिंग लागू होता है। चूंकि पृष्ठों को पहली बार प्रस्तुत किया जाता है जब वे प्रस्तुत किए जाते हैं, यह उस पहले प्रतिपादन पर फिर से बाध्यकारी लागू करेगा और कभी भी नहीं।

अभी तक यह मेरे लिए काम कर रहा है लेकिन मुझे नॉकआउट के साथ जेक्यूएम मल्टी-पेज टेम्पलेट्स का उपयोग करने के लिए अन्य लोगों की राय या समाधान सुनने के लिए उत्सुकता होगी।

संबंधित मुद्दे