макеты extjs, встраивание html в область просмотра extjs

Question

Я пытаюсь расположить следующий html внутри этой точки зрения extjs:

Ext.application({
name: 'HelloExt',
launch: function() {
    Ext.create('Ext.container.Viewport', {
        layout: 'fit',
        items: [
            {
                title: 'Hello Ext',
                html : 'Hello! Welcome to Ext JS.'
            }
        ]
    });
}

});

HTML:

<div id='logo'></div>
<header class='search'>
    <input type="search">
</header>
<br class="clear" />
<header class='main'>
    <nav class='main'>
        <ul>
            <li>Dashboard</li>
            <li>Claims Handling</li>
            <li>Reports</li>
            <li>Accounts</li>
        </ul>
    </nav>
    <nav class='menu'>
        <ul>
            <li>Mini Portal</li>
            <li>Authorize Transaction</li>
            <li>Insert Invoice Number</li>
            <li>Add Batch Claims</li>
        </ul>
    </nav>
</header>
<section id='container'>
    <div class='head'>
        <header class='sub'>
            <h1>Authorize Transaction</h1>
            <nav class='sub'>
                <ul>
                    <li><a href="">Authorize</a></li>
                    <li><a href="">Insert Number</a></li>
                    <li><a href="">Add Batch Claims</a></li>
                    <li><a href="">Change Details</a></li>
                </ul>
            </nav>
                            <section class="table"></section>
                            <div id="forms"></div>
        </header>

    </div>
</section>

Может кто-нибудь объяснить, пожалуйстакак это можно сделать?

Answer 1

Вы можете отформатировать ваш HTML следующим образом: http://pastebin.com/7muECqsQ а затем просто ссылаться на него при настройке вашего окна просмотра

Ext.application({name: 'HelloExt',launch: function() {
Ext.create('Ext.container.Viewport', {
    layout: 'fit',
    items: [
        {
            title: 'Hello Ext',
            html : innerHtml //your above html
        }
    ]
});

} });

Есть несколько других способов сделать это. Вы можете создать Template / XTemplate и применить его также к телу области просмотра.