Skip to content

Instantly share code, notes, and snippets.

@pedrohugorm
Last active August 29, 2015 14:01
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save pedrohugorm/d9debe88b3eddb020df8 to your computer and use it in GitHub Desktop.
Save pedrohugorm/d9debe88b3eddb020df8 to your computer and use it in GitHub Desktop.
Angular JS Helpers for ASP.NET MVC. Instead of using strings, which is not maintanable, use Lambda expressions. With that you can refactor your code without messing your angular js code ;)
using System;
using System.Collections.Generic;
using System.Linq;
using System.Linq.Expressions;
using System.Web.Mvc;
using System.Web.Routing;
using WebGrease.Css.Extensions;
namespace App_Code
{
/// <summary>
/// Angular JS Helpers for ASP.NET MVC. Instead of using strings, which is not maintanable, use Lambda expressions.
/// With that you can refactor your code without messing your angular js code ;)
/// Soon to add support for filters
/// </summary>
public static class AngularExpressionHelper
{
public static string Ng<TModel, TProperty>(this HtmlHelper<TModel> htmlHelper,
string varName,
Expression<Func<TModel, TProperty>> expression,
params object[] filters)
{
var data = AngularExpressionData.FromExpression(expression, varName, filters);
return data.ToString();
}
public static string Ng<TModel, TProperty>(this HtmlHelper<TModel> htmlHelper,
Expression<Func<TModel, TProperty>> expression, params object[] filters)
{
var data = AngularExpressionData.FromExpression(expression, filters);
return data.ToString();
}
}
public class AngularExpressionData
{
public const string ExpressionFormat = "{{{{ {0} }}}}";
public const string FilterSeparator = " | ";
public const string FilterWithParam = "{0} : {1}";
public const string FilterWithoutParam = "{0}";
public const string PropertySeparator = ".";
public string LeftName { set; get; }
public string[] RightName { set; get; }
public RouteValueDictionary Filters { set; get; }
private AngularExpressionData()
{
Filters = new RouteValueDictionary();
}
private AngularExpressionData(string properties, string varName = null)
: this()
{
LeftName = varName;
RightName = properties.Split(new[] {PropertySeparator}, StringSplitOptions.None);
}
public static AngularExpressionData FromExpression<T>(Expression<T> expression, string varName = null)
{
return new AngularExpressionData(ExpressionHelper.GetExpressionText(expression), varName);
}
public static AngularExpressionData FromExpression<T>(Expression<T> expression, string varName = null, params object[] filters)
{
var ang = new AngularExpressionData(ExpressionHelper.GetExpressionText(expression), varName);
ang.GetFilters(filters);
return ang;
}
public static AngularExpressionData FromExpression<T>(Expression<T> expression, params object[] filters)
{
var ang = new AngularExpressionData(ExpressionHelper.GetExpressionText(expression));
ang.GetFilters(filters);
return ang;
}
private void GetFilters(params object[] filters)
{
foreach (var filter in filters)
{
if (filter is string)
Filters.Add(filter as string, null);
else if (filter is AngularExpressionData)
{
var ang = filter as AngularExpressionData;
Filters.Add(ang.GetExpressionString(), null);
}
else
{
var attrs = new RouteValueDictionary(filter);
attrs.ForEach(r =>
{
if (r.Value is string)
Filters.Add(r.Key, string.Format("'{0}'", r.Value));
});
}
}
}
public string GetFiltersAsString()
{
return string.Join(FilterSeparator, Filters.Select(r =>
{
if (r.Value == null)
return string.Format(FilterWithoutParam, r.Key);
return string.Format(FilterWithParam, r.Key, r.Value);
}));
}
public string GetExpressionString()
{
var list = new List<string>();
if(!string.IsNullOrEmpty(LeftName))
list.Add(LeftName);
if (RightName.Any())
list.Add(string.Join(PropertySeparator, RightName));
return string.Join(PropertySeparator, list);
}
public override string ToString()
{
var list = new List<string>();
list.Add(GetExpressionString());
if(Filters.Any())
list.Add(GetFiltersAsString());
return string.Format(ExpressionFormat, string.Join(FilterSeparator, list));
}
}
}
@pedrohugorm
Copy link
Author

Usage:

@Html.Ng(form => form.Title, new {date="dd/MM/yyyy", xpto="123"}, "currency")

@Html.Ng("form", form => form.Title, new {date="dd/MM/yyyy"}, "currency")

Output:

{{ Title | date : 'dd/MM/yyyy' | xpto : '123' | currency }}
{{ form.Title | date : 'dd/MM/yyyy' | currency }}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment