2015-07-27 3 views
0

Я разрабатываю приложение Windows 8.1 с помощью html5/javascript. Необходимо создать пользовательские элементы управления, которые мы создаем в собственном приложении Windows. Причина: на одной странице есть код из нескольких страниц/модулей, поэтому для очистки кода и лучшего понимания.создать usercontrol с помощью javascript или winJS или angularJS для Windows8

Как создать usercontrols или есть ли другой способ сделать то же самое?

ответ

1

Да, есть возможность сделать то же самое. WinJS имеет fragments, который можно загружать и выгружать, так же, как usercontrols в формах Windows. Также страницы ведут себя одинаково, если вы используете шаблон шаблона Windows «navigator.js» -файла.

Here is image from MSDN site how navigator.js switches pages into default.html

Пример:

<div class="box"> 
    <button class="win-button action" id="basicFragmentLoadButton">Load the fragment</button><br /> 
    <div id="basicFragmentLoadDiv"></div> 
    <br /> 
    <div id="status"></div> 
</div> 

В Javascript файл:

В главном HTML файл кнопки, которая загружает фрагмент для целей тестирования и DIV с идентификатором, где будет загружен фрагмент определение использовать пространство имен WinJS.UI.Fragments «renderCopy» для отображения содержимого файла html, который вы хотите использовать в качестве usercontrol:

// Assign element into variable 
var basicFragmentLoadDiv = document.querySelector("#basicFragmentLoadDiv"); 

function resetOutput() { 
    basicFragmentLoadDiv.innerHTML = ""; 
} 

function basicFragmentLoad() { 
    resetOutput(); 


    WinJS.UI.Fragments.renderCopy("/pages/fragments/content/BasicFragmentLoad.html", basicFragmentLoadDiv) 
     .done(
      function() { 
       log("successfully loaded fragment", "sample", "status"); 
      }, 
      function (error) { 
       log("error loading fragment: " + error, "sample", "error"); 
      } 
     ); 

/pages/fragments/content/BasicFragmentLoad.html включает в себя просто элементы HTML, которые будут отображаться в основной файл HTML. Вы можете найти больше в разделе фрагментов в try.buildwinjs.com

+0

можете ли вы поделиться любым примером для этого. – Nishi

+0

Я добавил вам пример. – xdvarpunen

+0

Пожалуйста, отметьте как ответ, если вам помогли (: – xdvarpunen