2

現在、ノックアウト js のテンプレート化に取り組んでいます。私の要件は、文字列と行のインデックス値の組み合わせでフィールド (入力) の名前を設定する必要があることです。たとえば、「xxx3」。

私は2つのオプションを試しました。

'xxx' + ko.utils.arrayIndexOf(viewModel.mycollection, $data)

と

'xxx' + $index

最初のオプションは常にインデックス値に「-1」を与え、2 番目のオプションは機能しません。文字列連結なしで $index 値しか使用できないように思われるためです。

入力フィールドの名前プロパティに設定できるように、ノックアウトで文字列値を $index 値に連結できるかどうか誰か教えてください。

私が望む最終結果はこのようになるはずです。

<input class="text-box single-line" data-val="true" 
   data-val-required="The XXX field is required." id="XXX" type="text" name="XXX3">

これが私のテンプレートの外観です。

<table id ="editorRows" class="table">
        <tbody data-bind='template: {name: "rowTemplate", foreach: Rules }'></tbody>
    </table>

    <script id="rowTemplate" type="text/html">
        <tr data-bind="attr: { id: RuleKey }">
            <td>
                <div class="editor-field">
                    <input class="text-box single-line" data-val="true" data-val-required="The Name field is required." id="Name" type="text" data-bind="value: Name, attr: {name : 'Rules[' + $index + '].Name'}" />
                    <span class="field-validation-valid" data-bind="attr : { 'data-valmsg-for': 'Rules[' + $index + '].Name'}" data-valmsg-replace="true"></span>
                </div>
            </td>
</tr>
</script>
4

1 に答える 1

3

$indexはオブザーバブルであるため、値を取得するにはそれを呼び出す必要があります。したがって、属性の値を文字通りに設定しようとしていると仮定すると、次のRule[0].Nameようになります。

<input class="text-box single-line" data-val="true" data-val-required="The Name field is required." id="Name" type="text"
       data-bind="value: Name, attr: {name : 'Rules[' + $index() + '].Name'}" />
<span class="field-validation-valid" data-valmsg-replace="true"
      data-bind="attr : { 'data-valmsg-for': 'Rules[' + $index() + '].Name'}"></span>
于 2012-09-26T07:54:55.923 に答える