c# - 用于可选周围标签的优雅 MVC 代码

Question

完成以下任务的更优雅的代码是什么：

foreach(var filter in Model.Filters)
{
  if(filter.Selected)
  {
    <div class="crumb crumb_selected" id="@filter.ID">
      @* much more html can be here *@
      @filter.Title
      <span class="counter">
        (@filter.Count)
      </span>
    </div>
  } else {
    <div class="crumb" id="@filter.ID">
      <a href="@Model.ClickUrl(Model.SelectedFilters, filter)">
      @* much more html can be here but similar code as above *@
        @filter.Title
        <span class="counter">
          (@filter.Count)
        </span>
      </a>
    </div>
  }
}

• div / span 的重复 html 代码似乎是错误的代码
• css-class规范也应该在优雅的版本中解决

Answer 1

foreach(var filter in Model.Filters) 
{ 

    <div class="crumb @(filter.Selected? "crumb_selected":string.empty)" id="@filter.ID"> 
      @(filter.Selected? "<a href="@Model.ClickUrl(Model.SelectedFilters, filter)">" : string.empty)
      @filter.Title 
      <span class="counter"> 
        (@filter.Count) 
      </span> 
    </div> 
  }    
} 

本质上，这只是测试 filter.Selected 并且是您已经拥有的更简洁的形式。我没有测试语法，只是把它写下来，如果它没有编译，请原谅我。我不确定这是否更优雅，因为我不知道您对优雅的定义是什么。我以为你的意思是你更干。

Answer 2

@helper MyHelper(SomeDataType filter)
{
  @* much more html can be here *@
  @filter.Title
  <span class="counter">
    (@filter.Count)
  </span>
}

foreach(var filter in Model.Filters)
{
  if (filter.Selected)
  {
    <div class="crumb crumb_selected" id="@filter.ID">
      @MyHelper(filter)
    </div>
  } else {
    <div class="crumb" id="@filter.ID">
      <a href="@Model.ClickUrl(Model.SelectedFilters, filter)">
        @MyHelper(filter)
      </a>
    </div>
  }
}