1

是否可以将对象设置为无线电输入的值？

它尝试了这个http://jsfiddle.net/benroe/fah5f/3/，但它不起作用。那是一个错误吗？

＃模板

<script id='tempMain' type='text/ractive'>
{{# products}}
    <h1>{{name}}</h1>
    {{# options:i}}
        <div class='radio'>
            <label>
                <input type='radio' name='{{selectedRadio}}' value='{{options[i]}}'>{{name}}
            </label>
        </div>
    {{/}}
{{/}}
</script>

javascript

productData = [
{ name: 'Cameras', options: [
    { name: 'Canon', price: '396'},
    { name: 'Sony', price: '449'}
]}];

ractive = new Ractive({
    el: '#template',
    template: '#tempMain',
    data: {
        products: productData,
        selectedRadio: 'no Radio selected'
    }

});
4

2 回答 2

1

这实际上是在最近的 0.4.0 版本中出现的错误，但几天前已修复。{{options[i]}}值 - （因为它在该部分内{{#products:i}}）应该解析为products.0.options.0andproducts.0.options.1等等 - 而是解析为options.0and options.1。

有两种解决方案。一种是简单地使用{{this}}而不是{{options[i]}}- 正确解析（参见小提琴）。这假设在您的真实应用程序中（与这个简化的测试用例相反）您能够做到这一点。

第二种是使用开发版本，其中包含修复：http ://cdn.ractivejs.org/edge/ractive.js 。

我们将在不久的将来尝试推出一个新的稳定版本。带来不便敬请谅解！

于 2014-04-24T03:24:46.243 回答
0

根据 w3 规范值只能是字符串值http://www.w3.org/TR/html-markup/input.radio.html#input.radio.attrs.value

但是，您可以将字符串用作对象的键。将您的数据更改为类似

productData = [
  { name: 'Cameras', options: {
    Canon: { name: 'Canon', price: '396'},
    Sony: { name: 'Sony', price: '449'}
  }}];

然后将您的模板更改为

<script id='tempMain' type='text/ractive'>
{{# products}}
    <h1>{{name}}</h1>
    {{# options:i}}
        <div class='radio'>
            <label>
                <input type='radio' name='{{selectedRadio}}' value='{{i}}'>{{name}}
            </label>
        </div>
    {{/}}
{{/}}
</script>
于 2014-04-23T19:05:05.117 回答