9 | About
10 |
11 |
12 |
13 | @Body
14 |
15 | -
17 | @foreach (var person in People)
18 | {
19 |
- @person.FullName 20 | } 21 |
-
30 |
- @person.FullName 32 |
-
42 | @foreach (var person in People)
43 | {
44 |
- @person.FullName 45 | } 46 |
No people found
51 | } 52 | ``` 53 | 54 | You can write this 55 | 56 | ``` 57 |-
60 |
- @person.FullName 62 |
No people found
67 |Sorry, there's nothing at this address.
9 |Counter
4 | 5 |Current count: @currentCount
6 | 7 | 8 | 9 | @code { 10 | private int currentCount = 0; 11 | 12 | private void IncrementCount() 13 | { 14 | currentCount++; 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /Source/Tutorials/ForEachExample/Pages/Error.cshtml: -------------------------------------------------------------------------------- 1 | @page 2 | 3 | 4 |Error.
5 |An error occurred while processing your request.
6 | 7 |Development Mode
8 |9 | Swapping to Development environment will display more detailed information about the error that occurred. 10 |
11 |12 | The Development environment shouldn't be enabled for deployed applications. 13 | It can result in displaying sensitive information from exceptions to end users. 14 | For local debugging, enable the Development environment by setting the ASPNETCORE_ENVIRONMENT environment variable to Development 15 | and restarting the app. 16 |
17 | -------------------------------------------------------------------------------- /Source/Tutorials/ForEachExample/Pages/FetchData.razor: -------------------------------------------------------------------------------- 1 | @page "/fetchdata" 2 | 3 | @using ForEachExample.Data 4 | @inject WeatherForecastService ForecastService 5 | 6 |Weather forecast
7 | 8 |This component demonstrates fetching data from a service.
9 | 10 |Loading...
13 || Date | 19 |Temp. (C) | 20 |Temp. (F) | 21 |Summary | 22 |
|---|---|---|---|
| @forecast.Date.ToShortDateString() | 28 |@forecast.TemperatureC | 29 |@forecast.TemperatureF | 30 |@forecast.Summary | 31 |
36 |
| Index | 40 |Date | 41 |Temp. (C) | 42 |Temp. (F) | 43 |Summary | 44 |
|---|---|---|---|---|
| @item.Index | 50 |@item.Value.Date.ToShortDateString() | 51 |@item.Value.TemperatureC | 52 |@item.Value.TemperatureF | 53 |@item.Value.Summary | 54 |
ForEach demo
4 | 5 | Look in the FetchData.Razor file 6 | -------------------------------------------------------------------------------- /Source/Tutorials/ForEachExample/Pages/_Host.cshtml: -------------------------------------------------------------------------------- 1 | @page "/" 2 | @namespace ForEachExample.Pages 3 | @addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers 4 | @{ 5 | Layout = null; 6 | } 7 | 8 | 9 | 10 | 11 | 12 | 13 |
24 |
25 | An error has occurred. This application may no longer respond until reloaded.
26 |
27 |
28 | An unhandled exception has occurred. See browser dev tools for details.
29 |
30 | Reload
31 | 🗙
32 |
33 |
34 |
35 |
36 |
37 |
--------------------------------------------------------------------------------
/Source/Tutorials/ForEachExample/Program.cs:
--------------------------------------------------------------------------------
1 | using Microsoft.AspNetCore;
2 | using Microsoft.AspNetCore.Hosting;
3 | using Microsoft.Extensions.Configuration;
4 | using Microsoft.Extensions.Hosting;
5 | using Microsoft.Extensions.Logging;
6 | using System;
7 | using System.Collections.Generic;
8 | using System.IO;
9 | using System.Linq;
10 | using System.Threading.Tasks;
11 |
12 | namespace ForEachExample
13 | {
14 | public class Program
15 | {
16 | public static void Main(string[] args)
17 | {
18 | CreateHostBuilder(args).Build().Run();
19 | }
20 |
21 | public static IHostBuilder CreateHostBuilder(string[] args) =>
22 | Host.CreateDefaultBuilder(args)
23 | .ConfigureWebHostDefaults(webBuilder =>
24 | {
25 | webBuilder.UseStartup
8 |
16 |
--------------------------------------------------------------------------------
/Source/Tutorials/ForEachExample/Shared/NavMenu.razor:
--------------------------------------------------------------------------------
1 |
7 |
8 |
9 |
26 |
27 |
28 | @code {
29 | private bool collapseNavMenu = true;
30 |
31 | private string NavMenuCssClass => collapseNavMenu ? "collapse" : null;
32 |
33 | private void ToggleNavMenu()
34 | {
35 | collapseNavMenu = !collapseNavMenu;
36 | }
37 | }
38 |
--------------------------------------------------------------------------------
/Source/Tutorials/ForEachExample/Shared/SurveyPrompt.razor:
--------------------------------------------------------------------------------
1 |
2 |
3 | @Title
4 |
5 |
6 | Please take our
7 | brief survey
8 |
9 | and tell us what you think.
10 |
11 |
12 | @code {
13 | // Demonstrates how a parent component can supply parameters
14 | [Parameter]
15 | public string Title { get; set; }
16 | }
17 |
--------------------------------------------------------------------------------
/Source/Tutorials/ForEachExample/Startup.cs:
--------------------------------------------------------------------------------
1 | using ForEachExample.Data;
2 | using Microsoft.AspNetCore.Builder;
3 | using Microsoft.AspNetCore.Components;
4 | using Microsoft.AspNetCore.Hosting;
5 | using Microsoft.AspNetCore.HttpsPolicy;
6 | using Microsoft.Extensions.Configuration;
7 | using Microsoft.Extensions.DependencyInjection;
8 | using Microsoft.Extensions.Hosting;
9 | using System;
10 | using System.Collections.Generic;
11 | using System.Linq;
12 | using System.Threading.Tasks;
13 |
14 | namespace ForEachExample
15 | {
16 | public class Startup
17 | {
18 | public Startup(IConfiguration configuration)
19 | {
20 | Configuration = configuration;
21 | }
22 |
23 | public IConfiguration Configuration { get; }
24 |
25 | // This method gets called by the runtime. Use this method to add services to the container.
26 | // For more information on how to configure your application, visit https://go.microsoft.com/fwlink/?LinkID=398940
27 | public void ConfigureServices(IServiceCollection services)
28 | {
29 | services.AddRazorPages();
30 | services.AddServerSideBlazor();
31 | services.AddSingleton
30 | ```
31 |
32 | #### Using Open Iconic's SVG Sprite
33 |
34 | Open Iconic also comes in a SVG sprite which allows you to display all the icons in the set with a single request. It's like an icon font, without being a hack.
35 |
36 | Adding an icon from an SVG sprite is a little different than what you're used to, but it's still a piece of cake. *Tip: To make your icons easily style able, we suggest adding a general class to the* `