Best way to write razor (format issue)

Question

Hi I have the following code in razor:

@{ foreach (var item in this.Model) { if (item.Items == null) { @: <li @{if (item.Active) { <text> class="active" </text> } }> if (item.SpanClass == null) { @: <a href="@item.Url" @{ if (item.Active) { <text> class="waves-effect active" </text> } else { <text> class="waves-effect" </text> } }><i class="@item.Icon"></i><span> @item.Text </span></a> }else { @: <a href="@item.Url" @{ if (item.Active) { <text> class="waves-effect active" </text> } else { <text> class="waves-effect" </text> } }><i class="@item.Icon"></i><span> @item.Text <span class="@item.SpanClass">@item.SpanValue</span></span></a> } } @: </li> } }

It looks like this:

But I go to:

Then the code format is destroyed:

Any clue?

You can simplify all this considerably by using a view model that includes properties for your class names - e.g. <li class="@item.ClassName"> where ClassName is either "active" or null (in the case of null, then class name will be omitted from the html) — user3559349
– user3559349, Commented Nov 15, 2016 at 2:10
For the link it would be <a href="@item.Url" class="waves-effect @Model.ClassName" ... — user3559349
– user3559349, Commented Nov 15, 2016 at 2:12
This might be of some help stackoverflow.com/a/4942145/1339516 — Searching
– Searching, Commented Nov 15, 2016 at 3:41

Ahmed · Accepted Answer · 2016-11-15 08:22:52Z

I would do something like that

@{ foreach (var item in this.Model) { var activeClass = item.Active ? "active" : ""; if (item.Items == null) { <li class="@activeClass"> @if (item.SpanClass == null) { <a href="@item.Url" class="waves-effect @activeClass"><i class="@item.Icon"></i><span> @item.Text </span></a> } else { <a href="@item.Url" class="waves-effect @activeClass"><i class="@item.Icon"></i><span> @item.Text <span class="@item.SpanClass">@item.SpanValue</span></span></a> } </li> } } }

Collectives™ on Stack Overflow

Best way to write razor (format issue)

1 Answer 1

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Linked

Related