Dynamic tabs layout issue

Summary

Dynamic tabs layout issue

Content

Hi,

Trying to create dynamic tabs, when adding for each styling disappears and tabs look like regular links.

 

Code:

<oj-tab-bar edge="top" id="oj-tab-bar-1839322052-1" selection="{{$page.variables.ojTabBar18393220521SelectedItem6}}">
        <ul>

    <oj-bind-for-each data="{{ $flow.variables.usersArr }}">
        <template>
            <li>
                <a href="#" :id="[['oj-tab-bar-1839322052-1-tab-' + $current.index + '-tab']]" aria-controls="[['oj-tab-bar-1839322052-1-tab-' + $current.index + '-panel']]"><oj-bind-text value="{{'Tab '+$current.data.userName}}"></oj-bind-text></a>
            </li>
        </template>
    </oj-bind-for-each>
        </ul>
    </oj-tab-bar>