[英]Aurelia dynamically bound variable with template string
I am trying to set the dynamic id
of a component within a component.我正在尝试在组件中设置组件的动态
id
。
So the child component has a bindable uniqueId
property.所以子组件有一个可绑定的
uniqueId
属性。 The parent component has its own uniqueId
which I am trying to keep into the child component's uniqueId
, as such sort of following BEM convention:父组件有自己的
uniqueId
,我试图将其保留在子组件的uniqueId
中,就像遵循 BEM 约定一样:
<text-input-editor repeat.for="boxSide of boxSides"
uniqueId.bind="box-editor-${uniqueId}__${boxSide}-input"></text-input-editor>
But this gives me the following error: unconsumed token {
(abridged).但这给了我以下错误:未使用的
unconsumed token {
(删节)。
I tried with using the <let></let>
element as in https://aurelia.io/docs/templating/custom-elements#declarative-computed-values but that didn't work either.我尝试在https://aurelia.io/docs/templating/custom-elements#declarative-computed-values中使用
<let></let>
元素,但这也不起作用。
I am not sure how to do this in the view, as I would rather not handle this at the controller's level (this is just one of many components in that view).我不确定如何在视图中执行此操作,因为我宁愿不在控制器级别处理此问题(这只是该视图中的许多组件之一)。
Assuming uniqueId has a value in your viewmodel, as the expression already has a ".bind" format, this would be:假设 uniqueId 在您的视图模型中有一个值,因为表达式已经具有“.bind”格式,这将是:
<text-input-editor repeat.for="boxSide of boxSides"
uniqueId.bind="'box-editor-' + uniqueId + '__' + boxSide + '-input'"></text-input-editor>
Otherwise, it could be:否则,它可能是:
<text-input-editor repeat.for="boxSide of boxSides"
uniqueId="box-editor-${uniqueId}__${boxSide}-input"></text-input-editor>
A working version can be reviewed at:可以在以下位置查看工作版本:
So I didn't try specifically Cristián Ormazábal's answer but I fixed my problem by changing uniqueId
to unique-id
:所以我没有特别尝试 Cristián Ormazábal 的回答,但我通过将
uniqueId
更改为unique-id
来解决我的问题:
<text-input-editor repeat.for="boxSide of boxSides"
unique-id="box-editor-${uniqueId}__${boxSide}-input""
></text-input-editor>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.