ノックアウトを使用したHTMLヘルパー

Question

ノックアウトJSの値データバインディングを自動的に書き出すEditorFor HTMLヘルパーの拡張バージョンを使用すると非常に便利だと思っていました。

これは、クライアント側のビューモデルとサーバー側のビューモデルが同じ場合に使用します.-私はすでに、KOマッピングを使用してクライアントサイドビューモデルを自動生成し、AJAX経由でビューモデルを取得しています。

誰かがこのようなことを試したことがありますか、私がここで考えているものに似たものを含むプロジェクトはありますか？

リファクタリング時にデータバインド値が失われる危険性がないという利点があります。

Answer 1

私たちは、これらの行に沿って、完璧とはかけ離れたものを作っていますが、私たちはカスタムエクステンションでもっと多くを持っていますが、私は本質を抽出しました。

using System.Web.Mvc.Html; 

namespace System.Web.Mvc 
{ 
    public static class EditorForExtensions 
    { 
     public static MvcHtmlString TextBoxForViewModel<TModel, TProperty>(this HtmlHelper<TModel> htmlHelper, Expression<Func<TModel, TProperty>> expression) 
     { 
      ModelMetadata metadata = ModelMetadata.FromLambdaExpression(expression, htmlHelper.ViewData); 

      var htmlAttributes = HtmlAttributesForKnockout(metadata); 

      return htmlHelper.TextBoxFor(expression, htmlAttributes); 
     } 

     private static Dictionary<string, object> HtmlAttributesForKnockout(ModelMetadata metadata) 
     { 
      var htmlAttributes = new Dictionary<string, object>(); 

      var knockoutParameter = String.Format("value: {0}", metadata.PropertyName); 

      htmlAttributes.Add("data-bind", knockoutParameter); 

      return htmlAttributes; 
     } 
    } 
} 

これは、その後のように使用することができます。

@Html.TextBoxForViewModel(m => m.Name) 

Answer 2

は、それをドロップすると、それが動作持って探している人のために上記のチャドの答えにhtmlAttributes過負荷を追加したいです。他のすべてのヘルパーは、これらの例から簡単に構築できます。 （ありがとうチャド、あなたの拡張機能はノックアウトの使用への私の移行を容易にしました！）

using System.Collections.Generic; 
using System.Linq.Expressions; 
using System.Web.Mvc.Html; 

namespace System.Web.Mvc { 
    public static class KnockoutExtensions { 
     public static MvcHtmlString KnockoutTextBoxFor<TModel, TProperty>(this HtmlHelper<TModel> htmlHelper, Expression<Func<TModel, TProperty>> expression) { 
      var metadata = ModelMetadata.FromLambdaExpression(expression, htmlHelper.ViewData); 
      var htmlAttributes = HtmlAttributesForKnockout(metadata); 
      return htmlHelper.TextBoxFor(expression, htmlAttributes); 
     } 

     public static MvcHtmlString KnockoutTextBoxFor<TModel, TProperty>(this HtmlHelper<TModel> htmlHelper, Expression<Func<TModel, TProperty>> expression, object attributes) { 
      // convert passed anonymous object (attributes) into IDictionary<string,object> to pass into attribute parser 
      var attrs = HtmlHelper.AnonymousObjectToHtmlAttributes(attributes) as IDictionary<string, object>; 
      var metadata = ModelMetadata.FromLambdaExpression(expression, htmlHelper.ViewData); 

      var htmlAttributes = HtmlAttributesForKnockout(metadata, attrs); 

      return htmlHelper.TextBoxFor(expression, htmlAttributes); 
     } 

     private static Dictionary<string, object> HtmlAttributesForKnockout(ModelMetadata metadata, IEnumerable<KeyValuePair<string, object>> attributes = null) { 
      var htmlAttributes = new Dictionary<string, object>(); 

      var knockoutParameter = String.Format("value: {0}", metadata.PropertyName); 
      htmlAttributes.Add("data-bind", knockoutParameter); 

      if (attributes != null) foreach (var attr in attributes) htmlAttributes.Add(attr.Key, attr.Value); 

      return htmlAttributes; 
     } 
    } 
}