將html文件導入到Sencha Touch 2中

我試圖將外部html文件導入到Touch 2並遇到錯誤。我的看法代碼如下：將html文件導入到Sencha Touch 2中

Ext.define("GS.view.Demo", { 
    extend: 'Ext.container.Container', 
    xtype: 'container', 

    requires: [ 
    'Ext.Component', 
    'Ext.ItemCollection', 
    'Ext.Mask', 
    'Ext.behavior.Scrollable', 
    'Ext.layout.Layout', 
    ], 

    config: { 
    title: 'Demo', 
    iconCls: 'star', 


    items: [{ 
       flex: 1, 
       margins: '0 2 0 0', 
       title: 'Load raw html', 
       styleHtmlContent: true, 
       bodyPadding: 5, 
       loader: { 
        autoLoad: true, 
        url: 'SHdemo.html' 
       } 
      }] 

     } 
    });

和apps.js：

//<debug> 
Ext.Loader.setPath({ 
'Ext': 'sdk/src' 
}); 
//</debug> 

Ext.application({ 
    controllers: ["Main"], 

name: 'GS', 

requires: [ 
    'Ext.MessageBox' 
], 

views: ['Main', 'Home', 'Contact', 'Blog', 'Demo'], 

icon: { 
    57: 'resources/icons/Icon.png', 
    72: 'resources/icons/Icon~ipad.png', 
    114: 'resources/icons/[email protected]', 
    144: 'resources/icons/[email protected]' 
}, 

phoneStartupScreen: 'resources/loading/Homescreen.jpg', 
tabletStartupScreen: 'resources/loading/Homescreen~ipad.jpg', 

launch: function() { 
    // Destroy the #appLoadingIndicator element 
    Ext.fly('appLoadingIndicator').destroy(); 

    // Initialize the main view 
    Ext.Viewport.add(Ext.create('GS.view.Main')); 
}, 

onUpdated: function() { 
    Ext.Msg.confirm(
     "Application Update", 
     "This application has just successfully been updated to the latest version.  Reload now?", 
     function() { 
      window.location.reload(); 
     } 
    ); 
    } 
});

這個代碼拋出「如果他們的文件已加載以下類甚至沒有宣稱：「Ext.container.Container '「，如果我在我的視圖中將'Ext.container.Container'替換爲'Ext.Container'，我會得到」錯誤：[Ext.createByAlias]無法創建無法識別的別名的實例：widget.demo「。什麼是導入外部html文件的正確過程？

來源

2012-03-25 kjarsenal

不需要xtype：'container'。您應該添加一個別名到您的集裝箱像

extend: 'Ext.Container', 
alias:'widget.demo'

並將其添加到視域看起來是這樣的

Ext.Viewport.add({xtype:'demo'});

來源

2012-03-26 17:12:33 fuzzyLikeSheep

感謝您的幫助，模糊。該別名否定了窗口小部件錯誤，但我不確定聲明視口代碼的位置，並因此無法加載外部文件。我的「演示」屏幕上剛剛有一個空容器。 – kjarsenal 2012-03-27 03:15:29

您可以將xtype：'Demo'添加到視口，然後使用exampleviewport.setActiveItem（）調用它。此外容器沒有標題配置和邊距應該是餘量，bodyPadding應該只是填充。與加載器不同的是，您應該在偵聽器中添加諸如初始化之類的內容。在你的Items配置文件的上面flex裏添加xtype：'container'並將title改爲html。 – fuzzyLikeSheep 2012-03-27 15:55:59

這裏最大的問題是你有xtype：'container'。 xtype'container'已經被Ext.Container使用，所以你應該給你的類一個唯一的xtype。過去就像fuzzyLikeSheep提到的那樣，在這種情況下你有很多配置是無效的配置。 ajax調用將幫助您而不是加載程序配置 – 2012-04-04 14:36:00

將html文件導入到Sencha Touch 2中

回答

相關問題