Can't loop-init markup for FluentSliderLabels

I'm somewhat new to Blazor, and in one of my .razor files I've got a FluentSlider that I want to have a range of 0 to 255, with ticks incremented at 32 (I want it to be able to increment by 1, just have every 32nd tick labeled). I thought instead of a FluentSliderLabel tag for every tick, I could use a for loop to generate the markup for the ticks, like this:

<FluentSlider Min="0" Max="255" Step="1" @bind-Value=@SliderVal>
  <FluentSliderLabel Position="0" Style="font-size:20pt">
    0
  </FluentSliderLabel>
  @for(int i = 32; i < 255; i+=32) {
    <FluentSliderLabel Position="@i" Style="font-size:16pt">
      @i
    </FluentSliderLabel>
  }
  <FluentSliderLabel Position="255" Style="font-size:20pt">
    255
  </FluentSliderLabel>
</FluentSlider>

It puts the ticks in the right places, but they are all labeled "256". What must I do instead? Thanks...

I tested and it seems there maybe some bug need to be fixed here. You could try following workaroud.
Create a Component MySliderLabel.razor with following contect

<FluentSliderLabel Position="@pos"  Style="font-size:16pt">@pos</FluentSliderLabel>
@code {
    [Parameter] public int pos {get;set;}
}

Then you could use this custom component like following

<FluentSlider Min="0" Max="255" Step="1" @bind-Value=@SliderVal>
  <FluentSliderLabel Position="0" Style="font-size:20pt">
    0
  </FluentSliderLabel>
  @for(int i = 32; i < 255; i+=32) {
 
      <MySliderLabel pos="@i" />  
  }
  <FluentSliderLabel Position="255" Style="font-size:20pt">
    255
  </FluentSliderLabel>
</FluentSlider>

Test result