Mapped state into amp-list [src]

Question

I need to use a state as an input for the amp-list. But before that, I want to map the state (to perform some math or operations).

When mapping every position of the array into an object and put it into src, I cannot make it work (code here):

<amp-list [src]="menu.array.map(x => ({size_new: x.size.toUpperCase(), color_new: x.color.toUpperCase()}))" width="auto" height="100">
  <template type="amp-mustache">
    <div>
        {{size_new}} // {{color_new}}
    </div>
  </template>
</amp-list>

However, I can make it work if I map every array position into an array (code here):

<amp-list [src]="menu.array.map(x => [x.size.toUpperCase(), x.color.toUpperCase()])">
  <template type="amp-mustache" width="auto" height="100">
    <div>
        {{0}} // {{1}}
    </div>
  </template>
</amp-list>

Any suggestions? Thank you!

Answer 1

This issue has recently been solved via https://github.com/ampproject/amphtml/pull/23762