मैं वर्तमान में ऑनसेन यूई के साथ अपना पहला कॉर्डोवा ऐप बना रहा हूं। अब तक वादा करता है! लेकिन मैं एक ऐसी समस्या में भाग गया जो मैं हल नहीं कर सका और मुझे जवाब नहीं मिला।नेविगेशन के साथ ऑनसेन यूआई स्लाइडिंग-मेन्यू का संयोजन
मुझे आशा है कि यह एक शुरुआती प्रश्न है और इसे किसी के द्वारा अधिक आसानी से हल किया जा सकता है।
मैं मुख्य स्क्रीन पर एक स्लाइडिंग मेनू और अभी भी "सामान्य" नेविगेशन रखना चाहता हूं।
दो अलग दृष्टिकोण मैंने कोशिश की:
1)
<ons-navigator var="app.navi">
<ons-page>
<ons-sliding-menu menu-page="menu.html" main-page="page1.html" side="left"
var="menu" type="reveal" max-slide-distance="260px" swipable="true">
</ons-sliding-menu>
</ons-page>
</ons-navigator>
<ons-template id="menu.html">
<ons-page modifier="menu-page">
<ons-list-item class="menu-item" ng-click="menu.setMainPage('page2.html', {closeMenu: true})">
Continue last story
</ons-list-item>
...
</ons-page>
</ons-template>
<ons-template id="page1.html">
<ons-page ng-controller="BooksCtrl">
// Navigation in controller:
app.navi.pushPage("new_action.html", {
animation: "lift"
});
</ons-page>
</ons-template>
परिणाम: नहीं त्रुटि संदेश। लेकिन एक बार जब मैं पहले मुख्य पृष्ठ से दूसरे पृष्ठ पर नेविगेट करता हूं तो मैं स्लाइडिंग मेनू नहीं खोल सकता।
2) यहाँ के रूप में
<ons-sliding-menu menu-page="menu.html" main-page="page1.html" side="left"
var="menu" type="reveal" max-slide-distance="260px" swipable="true">
</ons-sliding-menu>
<ons-template id="menu.html">
<ons-page modifier="menu-page">
<ons-list-item class="menu-item" ng-click="menu.setMainPage('page2.html', {closeMenu: true})">
Continue last story
</ons-list-item>
...
</ons-page>
</ons-template>
<ons-template id="page1.html">
<ons-navigator animation="slide" var="app.navi">
<ons-page ng-controller="BooksCtrl">
// Navigation in controller:
app.navi.pushPage("new_action.html", {
animation: "lift"
});
</ons-page>
</ons-navigator>
</ons-template>
ही (GitHub रेपो कहा जाता navigator_sliding-मेनू में पाया आधिकारिक डेमो में के रूप में एक ही): http://codepen.io/argelius/pen/ogXGeV तो नेविगेशन तत्व पहले मुख्य-पृष्ठ पर ले जाया जाता है। परिणाम: मैं ऐप (नियंत्रक में pushPage के माध्यम से) के माध्यम से नेविगेट कर सकता हूं और मैं प्रत्येक पृष्ठ से मेनू खोल सकता हूं। लेकिन एक बार जब मैं मेनू में किसी लिंक पर क्लिक करता हूं तो किसी भी पुशपेज कॉल के परिणामस्वरूप त्रुटि संदेश होते हैं:
Uncaught TypeError: Cannot read property '$$phase' of null
Uncaught Error: Fail to fire "pageinit" event. Attach "ons-page" element to the document after initialization.
कोई विचार?
अग्रिम धन्यवाद
यहाँ एक ऐसी ही सवाल ही नहीं है: https://stackoverflow.com/questions/28878385/onsen-ui-using-sliding-menu-with-navigator और इस ट्यूटोरियल मददगार हो सकता है: http: // onsen .io/ब्लॉग/विकास-हाइब्रिड-मोबाइल-ऐप-ऑन-ऑनसेन-यूई/ –
मैंने इसे देखा। यहां समस्या: एक बार जब आप नेविगेटर तत्व वाले किसी पृष्ठ पर नेविगेट करने का प्रयास करते हैं तो मुझे निम्न त्रुटि मिलती है: 'त्रुटि: आप "ऑन-नेविगेटर" तत्व को "ऑन-पेज" तत्व नहीं दे सकते हैं। यह ठीक काम करता है यदि आप जिस पृष्ठ पर नेविगेट करते हैं वह एक "अंत पृष्ठ" है, इसलिए आगे कोई नेविगेशन नहीं है। मैंने उदाहरण बदल दिया: http: // codepen।io/anon/pen/WbaXrG यदि आप मेनू में ब्राउज़ होटल पर क्लिक करते हैं और फिर पहली आइटम आपको त्रुटि मिलती है। – DTFagus
त्रुटि कहती है कि आपको मुख्य पृष्ठ पर पहले तत्व के रूप में ' 'तत्व का उपयोग करना होगा, लेकिन आपके पास ' है। बस <ऑन-नेविगेटर> और स्विच करें और यह ठीक काम करेगा: http://codepen.io/anon/pen/LEggEy –