Blazor - control of repeated component

[aiqoo]

I may be asking a dumb question but i need to make sure i'm not missing something here.

In a certain list I have a component that is required to repeat itself in a foreach loop.

I need to control the component in each row seperately, when an operation occurs outside that specific component but in that row.

It can obviously achieved by creating a templated row component but I am trying to determine whether that can be done without creating additional components.

Some Code

@foreach (var data in pageModel.list)
{
    @code
    {
        callAttemptComponent callAttemptComponent1;
        statusSelectComponent statusSelectComponent1;
    }

    <tr>
        <td @onclick="@(() => selectedListItem(data))">#@data.ID</td>
        <td @onclick="@(() => selectedListItem(data))">@data.fullName</td>
        <td>@data.phone</td>
        <td>@data.zipCode</td>
        <td>@data.areaName</td>
        <td><tagsFormat tags="@data.wcms_tags" /></td>
        <td>@Helpers.DateFormat(data.creationDate, "short-date-time")</td>
        <td>
            <callAttemptComponent @ref="callAttemptComponent1" @key="@data.ID" leadID="@data.ID" count="@data.callAttemptsCount" btnPressed="@callAttemptEvent" />
        </td>
        <td>
            <statusSelectComponent @ref="statusSelectComponent1" @key="@data.ID" leadStatusList="@leadStatusList" leadID="@data.ID" statusID="@data.statusID" statusChanged="@statusChangedEvent" />
        </td>
    </tr>
}

[mkArtakMSFT]

Thanks for contacting us, @aiqoo.
It's not really clear what your'e trying to do? Please describe the scenario and the problem you're facing in more details.

[egil]

I don't think @code is supposed to be nested inside other things on a page or component, is it?

[aiqoo]

Thanks for the help

i want to initialize the callAttemptComponent
when status change inside statusSelectComponent

It is a simple and trivial thing when two components are present on a page using an event I change their state,,
But when I have a pair of components that should affect each other
When they are repeated in a loop I can not get control and change their state,

@code
I was wrong to think
Thet @code in the loop its would be set in the scoop every run and that way I would gain control

@foreach (var data in pageModel.list)
{
    @code
    {
        callAttemptComponent callAttemptComponent1;
        statusSelectComponent statusSelectComponent1;
    }
}

[aiqoo]

I solved this by add an instance of component object to the list and then I assigned to each component a reference of its own.

The question is whether it has a price in terms of performance and speed,
And is there another way to make a connection between two components that are repeated in foreach?

[mkArtakMSFT]

Looks like allowing @code in another block is an issue, and I've filed a separate issue to handle that.
Coming back to @aiqoo 's question regarding performance, you'll have to measure it for yourself. We have a high-level issue for perf, but it's not specific to a single scenario: #10449