Knockoutjs支持无线电绑定中的多个组(aka:name属性)

Jor*_*lli 4 knockout.js

我在尝试生成动态单选按钮组时遇到问题,通过name属性对它们进行分组.KO使用以下格式生成名称:"ko_unique_ {0}"并且它没有使用我正在设置的绑定.

不知道怎么解决这个问题?

非常感谢!

鉴于以下vm:

vm = {
  questions: [{ id: "q1", question: "first question", answer: "y" },
                   { id: "q2", question: "second question", answer: "n" }],
  answerOptions: [{ key: "y", value: "Yes" },
                           { key: "n", value: "No"}]
};
Run Code Online (Sandbox Code Playgroud)

以及以下标记:

<ol data-bind="foreach: questions">
  <li>
    <span data-bind="text: question"></span>
    <span data-bind="foreach: $parent.answerOptions">
      <span data-bind="text: value"></span><input type="radio" data-bind="value: key, name: $parent.id, checked: $parent.answer" />
    </span>
  </li>          
</ol>
Run Code Online (Sandbox Code Playgroud)

这是当前输出(名称属性包含ko_unique_1,ko_unique_2,ko_unique_3和ko_unique_4值而不是q1,q1,q2和q2):

<ol data-bind="foreach: questions">
  <li>
    <span data-bind="text: question">first question</span>
    <span data-bind="foreach: $parent.answerOptions">
      <span data-bind="text: value">Yes</span><input type="radio" data-bind="value: key, name: $parent.id, checked: $parent.answer" name="ko_unique_1" value="y">
      <span data-bind="text: value">No</span><input type="radio" data-bind="value: key, name: $parent.id, checked: $parent.answer" name="ko_unique_2" value="n">
    </span>
  </li>          
  <li>
    <span data-bind="text: question">second question</span>
    <span data-bind="foreach: $parent.answerOptions">
      <span data-bind="text: value">Yes</span><input type="radio" data-bind="value: key, name: $parent.id, checked: $parent.answer" name="ko_unique_3" value="y">
      <span data-bind="text: value">No</span><input type="radio" data-bind="value: key, name: $parent.id, checked: $parent.answer" name="ko_unique_4" value="n">
    </span>
  </li>          
</ol>
Run Code Online (Sandbox Code Playgroud)

son*_*iic 12

你不能name像那样设置输入.你必须attr像这样设置它:

attr : {name: $parent.id}
Run Code Online (Sandbox Code Playgroud)

这是一个有效的jsfiddle示例:http://jsfiddle.net/AJZcw/