C# 隐藏当月没有日期的行（自定义日历标记帮助器）

在本条之后： 我能够实现一个定制的日历标签助手，它只需要一个月和一年作为参数，并显示该月的日历

它将显示一个标准日历，其中包含前几个月的某些天数和未来的天数。 我想要的是隐藏当前月份中没有天数的任何行，因此本质上，某些月份可能只有5行，而不是标准日历中的6行

我试图用css隐藏某些单元格，但这仍然给了我6行空白单元格

请参阅文章中解释的示例代码笔：

如您所见，有一行日期不在该月。 我只想显示当前月份中有一些包含日期的行

下面是c#标记帮助器中呈现html的代码

[HtmlTargetElement("calendar", TagStructure = TagStructure.NormalOrSelfClosing)]
public class CalendarTagHelper : TagHelper  
{
    public int Month { get; set; }

    public int Year { get; set; }

    public List<CalendarEvent> Events { get; set; }

    public override void Process(TagHelperContext context, TagHelperOutput output)
    {
        output.TagName = "section";
        output.Attributes.Add("class", "calendar");
        output.Content.SetHtmlContent(GetHtml());
        output.TagMode = TagMode.StartTagAndEndTag;
    }

    private string GetHtml()
    {
        var monthStart = new DateTime(Year, Month, 1);
        var events = Events?.GroupBy(e => e.Date);

        var html = new XDocument(
            new XElement("div",
                new XAttribute("class", "container-fluid"),
                new XElement("header",
                    new XElement("h4",
                        new XAttribute("class", "display-4 mb-2 text-center"),
                        monthStart.ToString("MMMM yyyy")
                    ),
                    new XElement("div",
                        new XAttribute("class", "row d-none d-lg-flex p-1 bg-dark text-white"),
                        Enum.GetValues(typeof(DayOfWeek)).Cast<DayOfWeek>().Select(d =>
                            new XElement("h5",
                                new XAttribute("class", "col-lg p-1 text-center"),
                                d.ToString()
                            )
                        )
                    )
                ),
                new XElement("div",
                    new XAttribute("class", "row border border-right-0 border-bottom-0"),
                    GetDatesHtml()
                )
            )
        );

        return html.ToString();

        IEnumerable<XElement> GetDatesHtml()
        {
            var startDate = monthStart.AddDays(-(int)monthStart.DayOfWeek);
            var dates = Enumerable.Range(0, 42).Select(i => startDate.AddDays(i));

            foreach (var d in dates)
            {
                if (d.DayOfWeek == DayOfWeek.Sunday && d != startDate)
                {
                    yield return new XElement("div",
                        new XAttribute("class", "w-100"),
                        String.Empty
                    );
                }

                var mutedClasses = "d-none d-lg-inline-block bg-light text-muted";
                yield return new XElement("div",
                    new XAttribute("class", $"day col-lg p-2 border border-left-0 border-top-0 text-truncate {(d.Month != monthStart.Month ? mutedClasses : null)}"),
                    new XElement("h5",
                        new XAttribute("class", "row align-items-center"),
                        new XElement("span",
                            new XAttribute("class", "date col-1"),
                            d.Day
                        ),
                        new XElement("small",
                            new XAttribute("class", "col d-lg-none text-center text-muted"),
                            d.DayOfWeek.ToString()
                        ),
                        new XElement("span",
                            new XAttribute("class", "col-1"),
                            String.Empty
                        )
                    ),
                    GetEventHtml(d)
                );
            }
        }

        IEnumerable<XElement> GetEventHtml(DateTime d)
        {
            return events?.SingleOrDefault(e => e.Key == d)?.Select(e =>
                new XElement("a",
                    new XAttribute("class", $"event d-block p-1 pl-2 pr-2 mb-1 rounded text-truncate small bg-{e.Type} text-white"),
                    new XAttribute("title", e.Title),
                    e.Title
                )
            ) ?? new[] {
                new XElement("p",
                    new XAttribute("class", "d-lg-none"),
                    "No events"
                )
            };
        }
    }
}

[HtmlTargetElement（“日历”，TagStructure=TagStructure.NormalOrSelfClosing）]
公共类CalendarTagHelper:TagHelper
{
公共整数月{get；set；}
公共整数年{get；set；}
公共列表事件{get；set；}
公共覆盖无效进程（TagHelperContext上下文，TagHelperOutput输出）
{
output.TagName=“section”；
添加（“类”、“日历”）；
output.Content.SetHtmlContent（GetHtml（））；
output.TagMode=TagMode.starttagendtag；
}
私有字符串GetHtml（）
{
var monthStart=新日期时间（年、月、1）；
var事件=事件？.GroupBy（e=>e.Date）；
var html=newxdocument(
新XElement（“div”，
新XAttribute（“类别”、“容器流体”），
新的XElement（“头”，
新XElement（“h4”，
新XAttribute（“类”，“显示-4MB-2文本中心”），
monthStart.ToString（“MMMM yyyy”）
),
新XElement（“div”，
新XAttribute（“类别”，“行d-none d-lg-flex p-1 bg暗文本白色”），
Enum.GetValues（typeof（DayOfWeek））.Cast（）.Select（d=>
新XElement（“h5”，
新XAttribute（“类”、“列lg p-1文本中心”），
d、 ToString（）
)
)
)
),
新XElement（“div”，
新XAttribute（“类”，“行边框-右-0边框-下-0”），
GetDatesHtml（）
)
)
);
返回html.ToString（）；
IEnumerable GetDatesHtml（）
{
var startDate=monthStart.AddDays（-（int）monthStart.DayOfWeek）；
VarDates=Enumerable.Range（0,42）。选择（i=>startDate.AddDays（i））；
foreach（日期中的变量d）
{
如果（d.DayOfWeek==DayOfWeek.Sunday&&d！=开始日期）
{
收益返回新元素（“div”，
新XAttribute（“类别”，“w-100”），
字符串。空
);
}
var mutedclass=“d-none d-lg-inline-block bg light text muted”；
收益返回新元素（“div”，
新的XAttribute（“class”，$“day col lg p-2 border border-left-0 border-top-0 text truncate{（d.Month！=monthStart.Month？mutedclass:null）}），
新XElement（“h5”，
新XAttribute（“类”，“行对齐项目中心”），
新XElement（“span”，
新XAttribute（“类别”、“日期列1”），
d、 一天
),
新XElement（“小”，
新XAttribute（“类”、“列d-lg-none文本中心文本静音”），
d、 DayOfWeek.ToString（）
),
新XElement（“span”，
新XAttribute（“类”、“列-1”），
字符串。空
)
),
GetEventHtml（d）
);
}
}
IEnumerable GetEventHtml（日期时间d）
{
返回事件？.SingleOrDefault（e=>e.Key==d）？。选择（e=>
新XElement（“a”，
新的XAttribute（“类“，$”事件d块p-1 pl-2 pr-2 mb-1四舍五入文本截断小bg-{e.Type}文本白色”），
新的XAttribute（“标题”，即标题），
e、 头衔
)
)？？新[]{
新XElement（“p”，
新XAttribute（“类别”，“d-lg-none”），
“无事件”
)
};
}
}
}

我知道我需要调整这条线

var dates=Enumerable.Range（0,42）。选择（i=>startDate.AddDays（i））
要获得正确的范围，使当月没有天数的行根本不会被渲染，但我似乎无法对其进行处理。
您只需根据所需周数确定要显示的天数，即42（天）为6周。我只是选择了标准的42，因为我希望日历始终保持相同的视觉高度

无论如何，要计算要显示的周数，可以使用以下方法：

var weeks = (int)Math.Ceiling((DateTime.DaysInMonth(Year, Month) + (int)monthStart.DayOfWeek) / 7f);

然后，只需将
日期
初始化替换为：

var dates = Enumerable.Range(0, weeks * 7).Select(i => startDate.AddDays(i));

“我知道我需要调整这一行
var dates=Enumerable.Range（0,42）。选择（I=>startDate.AddDays（I））；
以获得正确的范围，以便当前月份中没有天数的行不会被渲染”添加筛选器是否有帮助<代码>其中（d=>d.Month==Month）