Шаблон для нокаута, специальный первый элемент

Итак, я разобрал свой мозг в этом. У меня есть foreach, выплевывая шаблоны, и я хочу, чтобы первый элемент имел специальный атрибут. Пока что решения, которые я нашел, не работают.

Это значение foreach:

<h3 class="question">Geografi</h3>   
        <p class="answer" data-bind="template: { name: 'geographyTmpl', foreach: geographyList,  templateOptions: { selections: selectedGeographies } }"></p>

Это шаблон:

<script id="geographyTmpl" type="text/html">
<input class="geoCheckList" validate="required:true, minlength:2" name="geoCheckList[]" type="checkbox" data-bind='value: $data, attr: { id: "Geo"+$index()},checked: $root.selectedGeographies' />
<label data-bind="text: $data, attr: { 'for': 'Geo'+$index()}"></label>

И я хочу добавить: "validate =" required: true, minlength: 2 "к первому элементу.

Что мне нужно делать?

Если это помогает, его для проверки jQuery.

Ответы

Ответ 1

проверить мой ответ на другой вопрос о первом элементе в KnockoutJS foreach

Пропустить элемент в массиве jock foreach jock?

<div data-bind="text: ItemsArray[0].someProperty"></div>
<div data-bind="foreach: ItemsArray">
<!-- ko if: $index() == 0 -->
     <div data-bind="text: someProperty"></div>
 <!-- /ko -->
<!-- ko if: $index() != 0 -->
    <div data-bind="text: anotherDifferentProperty"></div>    
 <!-- /ko -->
</div>

Ответ 2

Вы должны иметь возможность использовать вычисленный наблюдаемый, чтобы возвращать логическое значение, и если логическое значение true, вы показываете атрибут (стандартный нокаут)?

что-то вроде этого возможно

this.IsFirst = ko.computed(function() {
    return this == Array[0];
}, this);

кажется взломанным, но должен работать

или используйте

   {{if $item.first === $data}}

Ответ 3

У меня возникнет соблазн использовать настраиваемую привязку, а не шаблон, а затем получить значение $index из bindingContext и добавить подтверждение атрибут, только когда $index равен 0.

ko.bindingHandlers.yourBindingName = {
    init: function(element, valueAccessor, allBindingsAccessor, viewModel, bindingContext) {
        // Create your input and label elements here then
        $(element).append(// add your new elements in here);
    }
};