Как указать свойство name с помощью нокаута js

У меня есть связанный список, используя knockoutjs/mvc3

<div data-bind="foreach: phones">
   <input data-bind='value: number' />
</div>

чтобы отправить это действие моего контроллера, которое

[HttpPost]
public ActionResult Index([Deserialize] WizardModel wizard, IStepViewModel step)
{
}

Раньше я был связан с моим списком <T> с помощью Jquery, указав имя на входе, которое будет

 <input name="Phones[0].Name"
              Phones[1].Number etc..

Но я теперь использую нокаут. Я не понимаю, как это должно работать. Любой меня направит в правильном направлении.

Та

Ответ 1

Вы можете сделать это, используя привязку attr в шаблоне или foreach, например, если ваши номера телефонов находятся в наблюдаемом массиве.

<input data-bind='attr: { name: "Phones["+$index()+"].Name"}' />

Я также предполагаю, что вы используете последнюю версию нокаута, чтобы использовать индекс $.

Это позволит вам называть входы, чтобы они работали с привязкой к модели MVC.

Ответ 2

Вы можете использовать 'uniqueName', создавая нокаут. Вот документация: http://knockoutjs.com/documentation/uniqueName-binding.html

Если вы хотите настраивать привязку (например, уникальное генерация идентификатора), вы можете использовать пользовательскую привязку: http://knockoutjs.com/documentation/custom-bindings.html

Это полезные ответы для unuqueName и uniqueId: Уникальные идентификаторы в шаблонах knockout.js и Нокаут JS "uniqueName" binding - одно имя для двух полей

Моя реализация для уникального генерации id:

ko.bindingHandlers.uniqueId = {
    init: function (element, valueAccessor) {
        if (valueAccessor()) {
            element.id = ko.bindingHandlers.uniqueId.prefix + (++ko.bindingHandlers.uniqueId.counter);
        }
    },
    counter: 0,
    prefix: "unique_id_"
};

Ответ 3

Возможно, вы можете создать настраиваемую привязку, которая устанавливает атрибут name. Смотри сюда: http://knockoutjs.com/documentation/custom-bindings.html

Затем вы сможете написать:

<input data-bind='yourBindingName: Name'  />