英文:
How to set value.bind in array using the index inside repeat
问题
<input type="text" value.bind="guarantee[${$index}][testInput.property]" required>
英文:
I have a dynamic form build with repeat, id like to bind its value to array object and i want to use the $index to set the value to the write object in the array.
How the set the binding in the array in the current index and property name
The code
guaranteeItems = [
{
type: 'text',
label: 'firstName,
property: 'personFirstName'
},
{
type: 'text',
label: 'lastName,
property: 'personLastName'
},
]
guarantee = [
{
personFirstName: '',
personLastName: '',
personProffesion: '',
personMainIdentityTypeId: '',
personMainIdentityNo: '',
addressStreetName: '',
addressStreetNo: '',
addressEntrance: '',
addressCityId: '',
no: ''
}]
HTML Code:
<template repeat.for="testInput of guaranteeItems">
<label>${$index + 1}.*</label>
<div>
<label for="fname">${testInput.label}</label> // This is working
<input type="text" value.bind="guarantee[${$index}].$index.property" required> // This is not working
</div>
</template>
答案1
得分: 0
在数组的当前索引和属性名称上设置绑定，您可以使用以下语法进行Aurelia绑定：
<input type="text" value.bind="guarantee[$index][testInput.property]">
在这里，guarantee[$index] 将访问保证数组中当前索引 $index 处的对象，而 [testInput.property] 将访问当前 testInput 对象中指定的属性。
因此，您的更新后的代码将如下所示：
<template repeat.for="testInput of guaranteeItems">
<label>${$index + 1}.*</label>
<div>
<label for="fname">${testInput.label}</label>
<input type="text" value.bind="guarantee[$index][testInput.property]" required>
</div>
</template>
在您的原始代码中，您试图使用 ${} 来动态计算基于当前索引 $index 和 testInput 对象的属性值的保证对象的属性名称。然而，这个语法是不正确的，因为插值语法用于显示值，而不是在绑定表达式中使用。
希望这样能够清楚明白。
英文:
To set the binding in the array at the current index and property name, you can use the following syntax for Aurelia binding:
<input type="text" value.bind="guarantee[$index][testInput.property]">
Here, guarantee[$index] will access the object in the guarantee array at the current index $index, and [testInput.property] will access the property specified in the current testInput object.
So, your updated code will be:
<template repeat.for="testInput of guaranteeItems">
<label>${$index + 1}.*</label>
<div>
<label for="fname">${testInput.label}</label>
<input type="text" value.bind="guarantee[$index][testInput.property]" required>
</div>
</template>
In your original code, you were using ${} to try to dynamically compute the property name of the guarantee object based on the current index $index and the property value of the testInput object. However, this syntax was incorrect and caused the binding expression to fail because the interpolation syntax is for displaying values, not being used inside binding expressions.
Hope this makes sense.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论