ASP.NET Core(.NET6)Razor页面数据已加载但前端不显示的求助

问题背景 #

使用C#开发基于.NET6.0的ASP.NET Core Web应用，已成功连接SQL数据库且SQL语句执行正常。调试确认后端Topscoorder.cshtml.cs已加载数据，但前端Topscoorder.cshtml页面无法展示结果。

核心问题分析 #

后端代码问题 #

1. 局部变量覆盖成员变量：OnGet方法内重新声明了List<DivisieTotaal> DivisiesTjes局部变量，导致数据存入局部变量而非PageModel的成员变量，前端无法通过Model.DivisiesTjes获取数据。
2. 未声明变量类型：sqlT变量未指定类型，编译会报错。

前端代码问题 #

1. 表格内容为空：仅展示分区名称和表头，未遍历Topscoorders列表生成数据行。
2. 表头与数据不匹配：现有表头未对应要展示的进球数、球队等字段。

修正后的代码 #

后端代码（Topscoorder.cshtml.cs） #

using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc.RazorPages;
using Microsoft.AspNetCore.Http;
using System.Data.SqlClient;
using System;
using System.Data;

namespace Tournament_organizer.Pages
{
    public class TopscoorderModel : PageModel
    {
        public string? sessionvariable;
        public Guid variabelIDdivisie;
        public string? variabelTopScoorder;
        public Int32 variabelDoelpunten;
        public String variabelVlag;
        public String variabelTeam;
        // 保留成员变量，不在OnGet中重新声明
        public List<DivisieTotaal> DivisiesTjes = new();

        public void OnGet()
        {
            sessionvariable = "'25ed9970-ff7a-4750-a35f-1f9f5ec4b286'";

            if (HttpContext.Session.GetString("SessionVar") != null)
                sessionvariable = HttpContext.Session.GetString("SessionVar");

            try
            {
                String connectionString = "*************";
                using SqlConnection connection = new(connectionString);
                connection.Open();

                // 加载分区数据
                String sql = "SELECT * FROM dbo.division WHERE id_toernooi='25ed9970-ff7a-4750-a35f-1f9f5ec4b286' and aktief='J' ORDER BY Naam";
                SqlDataAdapter DivAdapter = new SqlDataAdapter(sql, connection);
                DataSet dsDivisie = new DataSet();
                DivAdapter.Fill(dsDivisie, "Divisie");

                foreach (DataTable ODTdiv in dsDivisie.Tables)
                {
                    foreach (DataRow ODRdiv in ODTdiv.Rows)
                    {
                        variabelIDdivisie = (Guid)ODRdiv["id"];
                        variabelTopScoorder = "To be confirmed";
                        List<TopscoorderTotaal> variabelTopscoorders = new List<TopscoorderTotaal>();

                        // 声明sqlT变量类型
                        string sqlT = "select  vlag, speler.naam, team.naam as team, sum(doelpunten) as doelpunten, sum(rodekaarten) as rode_kaarten, sum(gelekaarten) as gele_kaarten, sum(groenekaarten) as groene_kaarten  from speler, speler_game, game, division, land, league, team where speler.id = speler_game.id_speler and speler_game.id_game = game.id and game.id_division = division.id    and division.aktief = 'J' and game.aktief = 'J' and speler.aktief = 'J'    and land.id = league.id_land   and league.id = speler.id_league   and speler.id_team = team.id   and division.id =   '" + variabelIDdivisie.ToString() + "'   group by  land.vlag, speler.naam, team.naam order by sum(doelpunten) desc, sum(rodekaarten) asc, sum(gelekaarten) asc, sum(groenekaarten) asc";

                        SqlDataAdapter adapter = new SqlDataAdapter(sqlT, connection);
                        DataSet dsTopscoorder = new DataSet();
                        adapter.Fill(dsTopscoorder, "Topscoorder");

                        foreach (DataTable ODT in dsTopscoorder.Tables)
                        {
                            foreach (DataRow ODR in ODT.Rows)
                            {
                                variabelTopScoorder = (string)ODR["naam"];
                                variabelDoelpunten = (Int32)ODR["doelpunten"];
                                variabelVlag = (String)ODR["vlag"];
                                variabelTeam = (String)ODR["team"];

                                TopscoorderTotaal topscoorderTotaal = new()
                                {
                                    Doelpunten = variabelDoelpunten,
                                    Vlag = variabelVlag,
                                    Team = variabelTeam,
                                    Topscoorder = variabelTopScoorder
                                };
                                variabelTopscoorders.Add(topscoorderTotaal);
                            }
                        }

                        DivisieTotaal divisieTotaal = new()
                        {
                            id_division = variabelIDdivisie,
                            Naam = (String)ODRdiv["naam"],
                            Shotklok = (String)ODRdiv["shotklok"],
                            Topscoorders = variabelTopscoorders
                        };
                        // 向成员变量添加数据
                        DivisiesTjes.Add(divisieTotaal);
                    }
                }
            }
            catch (Exception ex)
            {
                Console.WriteLine("NOT Connected");
                Console.WriteLine("Exception: connectie NIET ok " + ex.Message);
            }
        }
    }

    public class DivisieTotaal
    {
        public String? Naam;
        public String? Shotklok;
        public Guid id_division;
        public List<TopscoorderTotaal>? Topscoorders;
    }

    public class TopscoorderTotaal
    {
        public String? Topscoorder;
        public Int32 Doelpunten;
        public String? Vlag;
        public String? Team;
    }
}

前端代码（Topscoorder.cshtml） #

@page
@model Tournament_organizer.Pages.TopscoorderModel
@using Microsoft.AspNetCore.Http
@addTagHelper*, Microsoft.AspNetCore.Mvc.TagHelpers
@using Microsoft.Extensions.Configuration;

@{
    Layout = "_Layout_Overzicht";
}
<div class="row eigentabel">
    <p>@DateTime.Now</p>
    <div class="container">
        <div class="row">
            @foreach (var item in Model.DivisiesTjes)
            {
                <h2>@item.Naam</h2>

                <table class="display">
                    <thead>
                        <tr>
                            <th>国旗</th>
                            <th>球员姓名</th>
                            <th>球队</th>
                            <th>进球数</th>
                        </tr>
                    </thead>
                    <tbody>
                        @if (item.Topscoorders != null && item.Topscoorders.Any())
                        {
                            @foreach (var topscoorder in item.Topscoorders)
                            {
                                <tr>
                                    <td><img src="@topscoorder.Vlag" alt="国旗" /></td>
                                    <td>@topscoorder.Topscoorder</td>
                                    <td>@topscoorder.Team</td>
                                    <td>@topscoorder.Doelpunten</td>
                                </tr>
                            }
                        }
                        else
                        {
                            <tr>
                                <td colspan="4">暂无数据</td>
                            </tr>
                        }
                    </tbody>
                </table>
            }
        </div>
    </div>
</div>

关键修改说明 #

1. 后端：删除OnGet内的List<DivisieTotaal> DivisiesTjes局部变量声明，确保数据存入PageModel的成员变量；为sqlT添加string类型声明。
2. 前端：在表格tbody中遍历item.Topscoorders生成数据行，调整表头与数据字段对应，添加空数据提示；修正原HTML标签错误（将<row>改为标准的<div class="row">）。

内容的提问来源于stack exchange，提问作者New' asp.net core' One