どのくらいのロジックAsp.Net Mvcの剃刀のビューで意味をなすか？

Question

私は私の剃刀の眺めであまりにも多くのロジックを使用している場合、私は現在自分自身に尋ねています。

私は論理とマークアップを分かち合うことを学んだが、面倒なことは私たちには良い機会を与える。次の例のように "動的な" CSSクラスを提供する機会が本当に好きです。

私が行ったことはベストプラクティスではないが、どうすれば正しく行われるのだろうか？限り、あなたのマークアップに入れているロジックはあなたが優れているビュー関連のあるよう

@using AtheleteManager.Helpers 
@using AtheleteManager.Models 
@using Microsoft.Ajax.Utilities 
@model AtheleteManager.Models.Athlete 

<div class="container col-lg-9 col-md-9 hidden-sm hidden-xs panel panel-primary topten padding-leftright-thirty"> 
    <div class="panel-heading negative-margin-leftright-thirty"> 
     <h1 id="">Timeline</h1> 
    </div> 
    <div id="timeline"> 
     <div class="row timeline-movement timeline-movement-top"> 
     <div class="timeline-badge timeline-future-movement"> 
      <a href="#"> 
       <span class="glyphicon glyphicon-plus"></span> 
      </a> 
     </div> 
     </div> 
     <div class="row timeline-movement"> 

     @foreach (var trainingPost in Model.TrainingPosts) 
     { 
      string className; 
      string offSet; 
      string debitsOrCredits; 
      var dateHelper = new DateHelper(); 
      <div class="timeline-badge"> 
       <span class="timeline-balloon-date-day">@trainingPost.Date.Day</span><br /> 
       <span class="timeline-balloon-date-month">@dateHelper.ToShortMonthName(trainingPost.Date)</span> 
      </div> 
      if (trainingPost.Id % 2 != 0) 
      { 
       className = "col-sm-6 timeline-item"; 
       offSet = "col-sm-11"; 
       debitsOrCredits = "credits"; 
      } 
      else 
      { 
       className = "col-sm-offset-6 col-sm-6 timeline-item"; 
       offSet = "col-sm-offset-1 col-sm-11"; 
       debitsOrCredits = "debits"; 
      } 
      foreach (var executedWorkouts in trainingPost.ExecutedWorkouts) 
      { 
       <div class="@className"> 
        <div class="row"> 
        <div class="@offSet"> 
         <div class="timeline-panel @debitsOrCredits"> 
          <ul class="timeline-panel-ul"> 
           <li> 
           <p> 
            <small class="text-muted"><i class="glyphicon glyphicon-time"></i> @trainingPost.Date.ToShortDateString()</small> 
           </p> 
           </li> 
           <li><span class="importo">Workout</span></li> 
           <li> 
           <h3>@executedWorkouts.Workout.Name</h3> 
           </li> 
           <li><span class="causale">  <b>@executedWorkouts.Workout.Rounds</b></span> </li> 
          </ul> 
         </div> 
        </div> 
        </div> 
       </div> 
      } 
     } 
     </div> 
    </div> 
</div> 

Answer 1

。

個人的に私はC#のブロックが私の意見の中にあるのが好きではないので、if文を条件演算子で置き換えます。このような

何か：

<div class="@(trainingPost.Id % 2 != 0 ? "col-sm-11" : "col-sm-offset-1 col-sm-11")"> 

これは、あなたがより簡潔で読みやすく表示維持するのに役立ちます。

最後に、IT関連の質問と同じくらい正しい答えがあるとは思えませんが、異なるアプローチがあると考えてください。

Answer 2

あなたのやり方はこれが最良の方法です。 また、私はRazorの利点があるので、できる限り使用するために同じことをします。

ビューは、モデルが更新されたときにのみ更新されます。

あなたはBundelConfig

Answer 3

にcssファイルを作成すると、私は個人的にがビュー内であまりにも多くのビジネスロジックを置くこと好きではないことを向上させることができます。あるそれはユニットテストすることは容易ではないビュー

主な理由は、アクションメソッドと比較します。 かみそり生成器を使用するか、を実装するか、のいずれかを使用する必要があります。どちらの方法でも、初期設定が多く必要となり、簡単に破損する傾向があります。

私はこれらをTrainingPostクラス内のプロパティとして、それらの値をController内に設定します。次に、単体テストを書くときに、それらの値をアサートすることができます。

public class TrainingPost 
{ 
    ... 
    public string ClassName { get; set; } 
    public string OffSet { get; set; } 
    public string DebitsOrCredits { get; set; } 
}