C#生成HTML表格时如何按条件隐藏特定li列表项

问题原因 #

你原有代码的核心问题是字符串插值的三元表达式语法错误，同时如果需要隐藏元素时不占页面位置，推荐用display属性替代visibility属性：

• visibility: hidden：元素不可见，但仍占据原有页面空间
• display: none：元素完全隐藏，不占用任何页面空间

另外你代码里的<ui>是无效HTML标签，应该改为无序列表的标准标签<ul>，避免样式不生效。

实现方案 #

这里提供两种常用实现方式：

方案1：通过style属性控制显隐

适合需要保留元素、仅动态切换显隐的场景：

private string GenerateInvoiceTable(IInvoiceResponeForPdf invoice)
{
    // 提前计算显隐样式，避免字符串内嵌套逻辑可读性差
    string hideStyle = invoice.InvoiceType == "Estimation" ? "display:none;" : string.Empty;
    string invoiceTitle = invoice.InvoiceType == "Estimation" ? "Estimation" : "Retail Invoice";
    return $@"<table  style='width:120mm;font-size:20pt;font-family:tahoma;border-collapse:collapse;'>
                <thead> 
                     <div style='text-align:center; width:25%'>
                     <ul class='list-unstyled'>
                            <li style='font-weight:bold;'>Ramkrishna </li>
                            <li>Begum Bazar,</li>
                            <li>Hyderabad - 500012,</li>
                            <li>Telagana, Code : 36,</li>                               
                            <li style='{hideStyle}'>M: 1234567898,Ph: 040-2222222,</li>
                            <li style='{hideStyle}'>GSTIN: abcdezjsj. </li>                                                                                             
                     </ul>
                    </div>
                    <div style='text-align:center; width:25%'>
                     <h4>{invoiceTitle}</h4>
                    </div>
               </thead>                             
                {GenerateInvoiceTableBody(invoice)}
                {GenerateInvoicefooter(invoice)}
            </table>";
}

方案2：条件渲染元素

适合不需要保留元素、生成的HTML更干净的场景，仅当发票类型不是估算单时才渲染对应li节点：

private string GenerateInvoiceTable(IInvoiceResponeForPdf invoice)
{
    // 先构建公共的列表项
    var contactItems = new List<string>
    {
        "<li style='font-weight:bold;'>Ramkrishna </li>",
        "<li>Begum Bazar,</li>",
        "<li>Hyderabad - 500012,</li>",
        "<li>Telagana, Code : 36,</li>"
    };
    // 非估算单时追加联系方式和GSTIN项
    if (invoice.InvoiceType != "Estimation")
    {
        contactItems.Add("<li>M: 1234567898,Ph: 040-2222222,</li>");
        contactItems.Add("<li>GSTIN: abcdezjsj. </li>");
    }
    string invoiceTitle = invoice.InvoiceType == "Estimation" ? "Estimation" : "Retail Invoice";
    return $@"<table  style='width:120mm;font-size:20pt;font-family:tahoma;border-collapse:collapse;'>
                <thead> 
                     <div style='text-align:center; width:25%'>
                     <ul class='list-unstyled'>
                            {string.Join(Environment.NewLine, contactItems)}                                                                                            
                     </ul>
                    </div>
                    <div style='text-align:center; width:25%'>
                     <h4>{invoiceTitle}</h4>
                    </div>
               </thead>                             
                {GenerateInvoiceTableBody(invoice)}
                {GenerateInvoicefooter(invoice)}
            </table>";
}

如果你的业务要求隐藏时必须保留元素的占位空间，把方案1里的display:none;替换为visibility:hidden;即可。

内容的提问来源于stack exchange，提问作者Cherry R