將ASP.NET MVC視圖轉換爲Angular的最佳方法

我正在重新設計現有的ASP.net mvc頁面，該頁面在單個頁面上顯示多個客戶端對象。之所以這麼說，是因爲頁面可以通過一次單擊來保存所有客戶/編輯。然而，正如我18個月前寫的那樣，感覺他們應該是一個更好的方式來做到這一點，因爲我必須使用FormBinder來映射\保存對象，這不是很漂亮。將ASP.NET MVC視圖轉換爲Angular的最佳方法

例如，我已經開始使用引導標籤，每個標籤是一個客戶端，包含的細節

<ul class="nav nav-tabs"> 

     @foreach (var client in Model.Clients) 
     { 
      <li><a data-target="#@client.ClientId" data-toggle="tab" href="#@client.ClientId"><i class="fa fa-star"></i> @client.Name</a></li> 

     } 

    </ul> 
    <div class="tab-content"> 

      @foreach (var client in Model.Clients) 
      { 
       <div class="tab-pane" id="@client.ClientId"> 
        <div class="form-horizontal" role="form"> 
         <div class="form-group"> 
          <label for="@client.Name" class="col-sm-2 control-label">Name:</label> 
          <div class="col-sm-10"> 
           @Html.TextBoxFor(model => client.Name, new { @class = "form-control", tabindex = "1"}) 
          </div> 
         </div> 

        </div> 
       </div> 
      } 


     </div>

是他們的一個更好的，更簡單的方式來做到這一點？理想情況下，我不想使用表單活頁夾？

想法？例子？

來源

2014-09-12 D-W

您的問題是將標準mvc /剃刀視圖轉換爲Angular的最佳方式？ – 2014-09-12 16:20:35

我會說，就加載時間而言，Angular會在這裏幫助你很多。在您的示例中，您將爲每個客戶端加載所有這些標籤的html。 Angular只會將它加載一次作爲模板，並在客戶端複製html。

角度相當於將是這樣的......

<div class="tab-content" ng-controller='ClientCtrl"> 
    <div class="tab-pane"> 
     <div class="form-horizontal" role="form"> 
      <div class="form-group" ng-repeat="client in clients"> 
       <label for="clientName" class="col-sm-2 control-label">Name:</label> 
       <div class="col-sm-10"> 
        <input name='clientName' type='text' class='form-control' tabindex='1'>{{client.Name}}</input> 
       </div> 
      </div> 

     </div> 
    </div> 
</div>

當然，你必須做一些工作來實現控制器，但它是很容易的事情。

好處是範圍處理您的所有ID，所以不需要跟蹤任何你自己。在某些方面，Angular是一個難以學習的過渡，但一旦你這樣做了，它使得管理代碼變得更容易。

來源

2014-09-12 16:24:58 Scottie

將ASP.NET MVC視圖轉換爲Angular的最佳方法

回答

相關問題