@page "/" <h1>Hello, world!</h1> @for (var i = 0; i < levels; i++) { <div>Level @i</div> @for (var j = 0; j < stuffPerLevel; j++) { int copy = allStuffCounter; <input type="text" @bind="stuff[copy]" @bind:event="oninput" /> <div>@stuff[copy]</div> if(allStuffCounter < stuffCounterLimit) allStuffCounter++; } } @code { string[] stuff = {"some stuff 1","some stuff 2","some stuff 3","some stuff 4", "some stuff 5","some stuff 6","some stuff 7","some stuff 8", "some stuff 9","some stuff 10","some stuff 11","some stuff 12", "some stuff 13","some stuff 14","some stuff 15","some stuff 16", "some stuff 17","some stuff 18","some stuff 19","some stuff 20" }; int allStuffCounter = 0; int levels = 4; int stuffPerLevel = 5; int stuffCounterLimit = 19; }
namespace BlazorFiddleProject { using Microsoft.AspNetCore.Components.Builder; using Microsoft.Extensions.DependencyInjection; public class Startup { public void ConfigureServices(IServiceCollection services) { } public void Configure(IComponentsApplicationBuilder app) { app.AddComponent<App>("app"); } } }
<!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <meta name="viewport" content="width=device-width"> <title>BlazorFiddleProject</title> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous"> <script src="_content/MatBlazor/dist/matBlazor.js"></script> <style> app { } </style> <script type="text/javascript"> </script> </head> <body> <app>Loading...</app> <script src="_framework/blazor.webassembly.js"></script> <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script> </body> </html>

Add component

BlazorFiddle was updated from Blazor 0.7 to .NET 6.0. Your old source code could not work. You need to upgrade to latest.