Syntax for oh-repeater on props

Add-ons UIs
1

I am working on a personal widget where you enter in props settings a comma-separated value.
Now I want to build an oh-repeater on props parameters (e.g. prop_1, prop_2, prop_3, …)

...
config:              
  fragment: true
  sourceType: range
  for: buttonLabel
  rangeStart: 1
  rangeStop: 6
...
      component: oh-button
      config:
        text: =???

text needs to be a concatenation of props.prop_ + loop.buttonlabel.toString()
What is here the correct syntax assuming the props are named prop_1, prop_2, prop_3, …?

As an alternative I tried to list the props directly in the in parameter:

...
config:
  fragment: true
  sourceType: array
  for: buttonLabel
  in:
    - props.prop_1
    - props.prop_2.toString()
    - =props.prop_3
    - ...
     
      component: oh-button
        config:
          text: =loop.buttonLabel.split("=")[0]

obviously none of the above props.prop1 is correct.

Anybody has got a clue about the correct syntax?

2

=props['prop_' + loop.buttonLabel.toString()] assuming sourceType: range like in your first example.

3

that was also on my list of hundreds of attempts :slight_smile:
unfortunately it does not work.
Preview shows undefined
(widget saved, props are set and widget redrawn)

4 
uid: widget_116204d47c
props:
  parameterGroups: []
  parameters:
    - name: prop_1
      label: Prop 1
      type: TEXT
    - name: prop_2
      label: Prop 2
      type: TEXT
    - name: prop_3
      label: Prop 3
      type: TEXT
tags: []
component: f7-card
config:
  title: '=JSON.stringify(props)'
slots:
  default:
    - component: oh-repeater
      config:
        for: i
        sourceType: range
        rangeStart: 1
        rangeStop: 3
      slots:
        default:
          - component: oh-button
            config:
              text: =props['prop_' + loop.i]

image
image

1 Like
5

got it - made a typo…

working perfectly!