expected output:
row 0/3 column 0/12 | column 1/12 | column 2/12 | ... row 1/3 column 0/12 | column 1/12 | column 2/12 | ... row 2/3 column 0/12 | column 1/12 | column 2/12 | ...
(works in the authoring tool)
observed output: (real device)
row 0/2 column 0/1 row 1/2 column 0/1 row 2/2 column 0/2
authoring tool export:
{
"document": {
"type": "APL",
"version": "1.0",
"theme": "dark",
"import": [],
"resources": [],
"styles": {},
"layouts": {},
"mainTemplate": {
"parameters": [
"payload"
],
"item": {
"type": "Container",
"width": "100vw",
"height": "100vh",
"items": [
{
"type": "Sequence",
"height": "100%",
"data": "${payload.dummy.properties.rows}",
"scrollDirection": "vertical",
"item": {
"type": "Container",
"items": [
{
"type": "Text",
"text": "row ${index} / ${length}"
},
{
"type": "Sequence",
"scrollDirection": "horizontal",
"width": "100%",
"data": "${data.cols}",
"item": {
"type": "Container",
"width": "400px",
"items": [
{
"type": "Text",
"text": "column ${index} / ${length}"
}
]
}
}
]
}
}
]
}
}
},
"dataSources": {
"dummy": {
"type": "object",
"properties": {
"rows": [
{
"cols": [
"foo",
"bar",
"foo",
"bar",
"foo",
"bar",
"foo",
"bar",
"foo",
"bar",
"foo",
"bar"
]
},
{
"cols": [
"foo",
"bar",
"foo",
"bar",
"foo",
"bar",
"foo",
"bar",
"foo",
"bar",
"foo",
"bar"
]
},
{
"cols": [
"foo",
"bar",
"foo",
"bar",
"foo",
"bar",
"foo",
"bar",
"foo",
"bar",
"foo",
"bar"
]
}
]
}
}
}
}
the following markup works fine, except I can't use the desired variables ${index} and ${length} (always gives 0 and 1)
{
"type": "APL",
"version": "1.0",
"theme": "dark",
"import": [],
"resources": [],
"styles": {},
"layouts": {},
"mainTemplate": {
"parameters": [
"payload"
],
"item": {
"type": "Container",
"width": "100vw",
"height": "100vh",
"items": [
{
"type": "Sequence",
"height": "100%",
"data": "${payload.dummy.properties.rows}",
"scrollDirection": "vertical",
"item": {
"type": "Container",
"items": [
{
"type": "Text",
"text": "row ${index} / ${length}"
},
{
"type": "Sequence",
"scrollDirection": "horizontal",
"width": "100%",
"item": {
"type": "Container",
"data": "${data.cols}",
"direction": "row",
"items": [
{
"type": "Container",
"width": "400px",
"items": [
{
"type": "Text",
"text": "column ${index} / ${length}"
}
]
}
]
}
}
]
}
}
]
}
}
}
