Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>Let's start with a maxim that was initially proposed by Rob Conery: if there's an embedded "if" somewhere in your View, it's probably an indicator that you should either A.) create an HtmlHelper or B.) retract the logic from the view and insert it into your ViewModel.</p> <p>By doing so, you can clean up your View to look something like this (you get the idea):</p> <pre><code> &lt;div id="followedFriends"&gt; &lt;% foreach (var friend in Model.FollowedFriends) { %&gt; &lt;div id="friendContainer"&gt; &lt;div class="followedFriend"&gt; &lt;div class="userName"&gt; &lt;%: Html.ActionLink(friend.FoFriend.UserName, "Visitor", "Home", new {userID = friend.FoFriend.UserId}, null)%&gt; &lt;/div&gt; Currently reading: &lt;br /&gt; &lt;div class="bookLinks"&gt; &lt;%: Html.DisplayBooklinks(friend) %&gt; &lt;/div&gt; &lt;div class="bookReviews"&gt; &lt;%: Html.DisplayBookReviews(friend) %&gt; &lt;/div&gt; &lt;div class="bookQuotes"&gt; &lt;%: Html.DisplayQuotes(friend) %&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;% } %&gt; &lt;/div&gt; </code></pre> <p>At this point, if there's any chance that this piece of UI might be consumed in some other page, you should consider throwing it into a user control. By doing so, your view could now look something like this:</p> <pre><code>&lt;% Html.RenderPartial("FriendDetails", Model.FollowedFriends); %&gt; </code></pre> <p>Ultimately, whenever your View starts to look like soup, it's because your view is doing too much thinking. Which, in turn, means: some other layer of your application isn't thinking enough. By pinpointing logic in your Views, and by determining what abstractions might aid you in your attempt to remain DRY, your Views will become much more readable and much more maintainable.</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload