溫泉UI：一直存在動態添加內容

我有兩個項目第1頁和第2頁滑動菜單：溫泉UI：一直存在動態添加內容

<body ng-controller="PageController" > 
<ons-sliding-menu main-page="page1.html" 
        menu-page="menu.html" 
        side="left" 
        max-slide-distance="250px" 
        var="menu"> 
</ons-sliding-menu> 
<ons-template id="page1.html"> 
    <ons-page > 
     <ons-toolbar > 
      <div class="left"> 
       <ons-toolbar-button ng-click="menu.toggleMenu()"><ons-icon icon="ion-navicon" style="font-size: 32px; width: 1em;"></ons-icon></ons-toolbar-button> 
      </div> 
      <div class="center lang" >Page 1</div> 
     </ons-toolbar> 

     <div class="template-content" > 

     </div> 
    </ons-page> 
</ons-template> 
<ons-template id="page2.html"> 
    <ons-page> 
     <ons-toolbar> 
      <div class="left"> 
       <ons-toolbar-button onclick="menu.toggleMenu()"><ons-icon icon="ion-navicon" style="font-size: 32px; width: 1em;"></ons-icon></ons-toolbar-button> 
      </div> 
      <div class="center">Page 2</div> 
     </ons-toolbar> 
     <div class="template-content"> 

     </div> 
    </ons-page> 
</ons-template> 
<ons-template id="menu.html"> 
    <ons-list> 
     <ons-list-item modifier="chevron" onclick="menu.setMainPage('page1.html', { closeMenu: true })"> 
      Page 1 
     </ons-list-item> 
     <ons-list-item modifier="chevron" onclick="menu.setMainPage('page2.html', { closeMenu: true })"> 
      Page 2 
     </ons-list-item> 
    </ons-list> 
</ons-template>

當我通過jQuery ondeviceready事件添加動態內容：

$('.template-content').append('<p>Hello World</p>');

我會在第一時間看到內容，但當我將視圖更改爲page2，然後再次更改爲page1時，我動態添加的內容消失。我認爲，每當觀點發生變化，就會毀掉這個dom。

我該如何預防溫泉用戶破壞dom？這樣我的動態內容將被保留。

我發現了「持久性」屬性，但這在我的情況下不起作用。

預先感謝您！

來源

2015-04-04 katzu

當你使用'setMainPage（）'，舊頁面被銷燬以加載新頁面，所以當你回到舊頁面時，所有的東西都會被重新創建。例如，您需要使用諸如本地存儲之類的東西來存儲您的頁面內容，並從中創建您的頁面加載內容。 – 2015-04-06 03:13:10

嘗試在每次推送頁面時設置內容。您可以像這樣使用回調選項。

menu.setMainPage('page1.html', { closeMenu: true, 
           callback:function(){ 
           $('.template-content').append('<p>Hello World</p>');}})

來源

2015-08-28 13:32:00 Anima

你必須使用溫泉UI的導航邏輯遵循本指南：

http://onsen.io/reference/ons-navigator.html

你必須處理使用方法pushPage和導航對象的popPage頁面之間的堆棧導航。

setMainPage（）方法破壞之前創建的上一頁。

來源

2015-09-16 11:02:57 Jullios

溫泉UI：一直存在動態添加內容

回答

相關問題