Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
255 views
in Technique[技术] by (71.8m points)

c# - Getting ArgumentOutOfRangeException using for loop in Blazor component

I'm trying out Blazor and I'm getting this exception when I'm trying to load a list of checkboxes using a for loop.

I've created the list here:

public List<Month> Months { get; set; }

protected override void OnInitialized()
        {
            List<Month> months = new List<Month>()
            {
                new Month{MonthId = 0, MonthName = "All Months", isMonthChecked = false},
                new Month{MonthId = 1, MonthName = "Jan", isMonthChecked = false},
                new Month{MonthId = 2, MonthName = "Feb", isMonthChecked = false},
                new Month{MonthId = 3, MonthName = "Mar", isMonthChecked = false},
                new Month{MonthId = 4, MonthName = "Apr", isMonthChecked = false},
                new Month{MonthId = 5, MonthName = "May", isMonthChecked = false},
                new Month{MonthId = 6, MonthName = "Jun", isMonthChecked = false},
                new Month{MonthId = 7, MonthName = "Jul", isMonthChecked = false},
                new Month{MonthId = 8, MonthName = "Aug", isMonthChecked = false},
                new Month{MonthId = 9, MonthName = "Sep", isMonthChecked = false},
                new Month{MonthId = 10, MonthName = "Oct", isMonthChecked = false},
                new Month{MonthId = 11, MonthName = "Nov", isMonthChecked = false},
                new Month{MonthId = 12, MonthName = "Dec", isMonthChecked = false}
            };
};

            Months = months.ToList();
            base.OnInitialized();

Then, I created the loop in the Blazor component:

@{ 
            for (int i = 0; i < @Months.Count(); i++)
            {
            <ul>
                <li><label for="@Months[i].MonthId" id="checkboxLabel">@Months[i].MonthName</label></li>
                <li><InputCheckbox id="@Months[i].MonthId" @bind-Value="@Months[i].isMonthChecked"></InputCheckbox></li>
            </ul>
            }
        }

I've stepped through the debugger and it is pulling the correct data, but when it finishes, it gives me the error. If I reduce the count to 12 (should be 13), it works. Not sure what is going on here.

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

You can solve it like this:

@for (int j = 0; j < Months.Count; j++)
{
    int i = j;  // a local copy to solve the capture problem

    <ul>
        <li><label for="@Months[i].MonthId" id="checkboxLabel">@Months[i].MonthName</label></li>
        <li><InputCheckbox id="@Months[i].MonthId" @bind-Value="@Months[i].isMonthChecked"></InputCheckbox></li>
    </ul>
}

Which means this is a new, Blazor specific variation on 'capturing the loop variable'.

When you look at the <pagename>.razor.g.cs file you can see that the checkbox requires two lambda's, here is a snippet:

 __value => Months[i].isMonthChecked = __value

and after the for-loop, when the RenderTree is being built, the value of i will be Count for all months.

Using Count()-1 in the original code (your temporary fix) will prevent the exception but note that the form will not function properly, the wrong month will be checked.

General conclusion: don't mix EditForm with a for-loop. foreach() is safe.


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...