Question

假设我有List以下型号 -

public class stock
{
  public string modelNo {get;set;}
  public List<string> serialNumbers {get;set;}
}

我希望将其显示为表格，例如 -

Model No  |  Serial Numbers
----------------------------
Model A   |  ABC
          |  DEF
          |  GHI
----------------------------
Model B   |  123
          |  456
----------------------------

要显示表格，我正在使用类似下面的内容，但我在最后</tr>下方得到一个恼人的绿色波浪线 -

<table>
<tr>
  <th> 
    Model No
  </th>
  <th>
    Serial Numbers
  </th>
</tr>      
@foreach (SalesOrderDetail line in Model)
{
  int rowSpan = 1;
  if (line.serialNumbers.Count() != 0)
  {
    rowSpan = line.serialNumbers.Count();
  }
  <tr>
    <td rowspan="@rowSpan">
      @line.modelNo
    </td>
    @{
        int itemNo = 0;
    }
    @foreach (string serial in line.serialNumbers)
    {
      if (itemNo > 0)
      {
        @:<tr>
      }
      <td>
        @serial
      </td>
      {
        itemNo++;
        if (itemNo < rowSpan)
        {
          @:</tr>
        }
      }
    }
    </tr> <- Green squiggle here ("End tag is missing matching start tag")
  }
</table>

我知道这是真的轻微的烦恼，但有没有人知道如何处理它？</ p>

Answer 1

问题是编辑在编辑时无法理解编辑if (itemNo > 0)的逻辑。为了避免验证错误，你需要重构这个有一个循环并根据循环发出td元素，如下所示：

@{
    int itemNo = 0;
}
@foreach (string serial in line.serialNumbers)
{
<tr>
  if (itemNo == 0)
  {
    <td rowspan="@rowSpan">
      @line.modelNo
    </td>
  }
  <td>
    @serial
  </td>
  {
    itemNo++;
  }
</tr>
}

请注意，此代码块并不完全等效;如果tr为空，则不会呈现line.serialNumbers。但是，如果这是一个要求，您仍然可以使用if块单独添加它，就像这样（这也修复了可能的rowspan="0"错误）：

@if (rowSpan > 0) {
    @{
        bool first = true;
    }
    @foreach (string serial in line.serialNumbers) {
    <tr>
        @if (first) {
                first = false
        <td rowspan="@rowSpan">
            @line.modelNo
        </td>
        }
        <td>
        @serial
        </td>
    </tr>
    }
} else {
    <tr>
        <td colspan="2">
            @line.modelNo
        </td>
    </tr>
}

在Razor中创建动态表，同时避免绿色VS验证波形

1 个答案: