Добавление пользовательского класса в WinJS.UI.NavBarCommand

Question

Я программно создаю NavBar в WinJS примерно так:

var navEl = document.getElementById('win-navbar-container');    
var navBar = new WinJS.UI.NavBar(navEl);
var containerEl = document.createElement('div');
var navBarContainer = new WinJS.UI.NavBarContainer(containerEl);
var data = [
    { 'label': 'Test 1', 'icon': 'world' },
    { 'label': 'Test 2', 'icon': 'world' },
    { 'label': 'Test 3', 'icon': 'world' }
]
var itemList = new WinJS.Binding.List(data);
navBarContainer.data = itemList    

Проблема в том, что мне нужно добавить свой собственный класс в navBarCommands.

Есть ли какая-либо опция, которую я могу добавить в мой массив, чтобы выполнить это?

Заранее спасибо.

Answer 1

Вы можете управлять этим, предоставляя объект шаблона с пользовательской функцией рендеринга для NavBarContainer:

var navEl = document.getElementById('navbar');
var navBar = new WinJS.UI.NavBar(navEl);
var containerEl = document.createElement('div');
navEl.appendChild(containerEl);

var template = {
    render: function (item, navbarCommandEl) {
        navbarCommandEl.classList.add(item.state);
    }
};
var navBarContainer = new WinJS.UI.NavBarContainer(containerEl, {
    template: template
});
var data = [
    { label: 'Test 1', icon: 'world', state: 'bold' },
    { label: 'Test 2', icon: 'world', state: 'normal'},
    { label: 'Test 3', icon: 'world', state: 'underlined' }
]
var itemList = new WinJS.Binding.List(data);
navBarContainer.data = itemList;

Надеюсь, это поможет!:)