2017-10-16 108 views
0

我有模板,中繼器:

​​

其中打印結果:

0 - 0 
0 - 1 
1 - 0 
1 - 1 

如果我使用自定義元素child-item用相同的模板:

<template> 
    <p>${ $parent.$index } - ${ $index }</p> 
</template> 

並使用child-item寫我的原始示例:

<template repeat.for="i of 2"> 
    <child-item repeat.for="j of 2"></child-item> 
</template> 

結果只有:

- 
- 
- 
- 

有沒有辦法傳播$家長和$指數透明的child-item

UPDATE

後嘗試一些建議,最近我來到的是:

<template repeat.for="i of 2"> 
    <child-item repeat.for="j of 2" parent-index.bind="$parent.$index" index.bind="$index"></child-item> 
</template> 

child-item模板的樣子:

<template bindable="parentIndex, index"> 
    <p>${ parentIndex } - ${ index }</p> 
</template> 

綁定$parent情況下直接與parent.bind="$parent"不工作。父索引必須直接綁定。通過這種方法,任何與$parent.$parent.$index內聯的內容都無法實現。

回答

1

您需要使用數據綁定才能將其傳入。將或index可綁定屬性添加到child-item視圖模型。

+0

import { customElement, bindable } from 'aurelia-framework'; @customElement('child-item') export class ChildItem { @bindable index; } 

兒童item.html

<template> <p>${ index }</p> </template> 

模板,中繼器舉個簡單的例子? 'index.bind =「$ index」'似乎合乎邏輯,但當前綁定上下文的值應該是多少? 'parent.bind = 「...」'? – Nenad

2

這樣的事會工作

兒童item.ts:你能

<template> 
    <require from="./child-item"> 

    <child-item repeat.for="child of childred" index.bind="$index"></child-item> 
</template> 
+0

'$ index'通過'bind(bindingContext:Object,overrideContext:Object)'中的'overrideContext'傳遞給自定義元素。所以'$ index'默認工作,不需要手動綁定。問題是如何使'$ parent'可用。 – Nenad

+0

從代碼中不清楚你需要'$ parent'作爲什麼? 'bindingContext'是父類,雖然 – classicalConditioning

+0

我修改了問題,使其更加清晰,並添加更新後,我嘗試了你和@ ashley授予建議。我也必須按照你的建議綁定索引。 – Nenad