HandlebarsHelper will ultimately help you inject your handlebars files into your ASP.Net application.
Use Nuget to install, either search for HandlebarsHelper
in the Package Manager UI or from the console Install-Package HandlebarsHelper
. https://www.nuget.org/packages/HandlebarsHelper/
The most common use case is you'd like to bundle precompiled/minified EmberJS Handlebar templates.
For more information on Bundling, visit http://go.microsoft.com/fwlink/?LinkId=254725
public class BundleConfig
{
public static void RegisterBundles(BundleCollection bundles)
{
//other bundles
// ~/bundles/templates is the bundle name
// ~/Scripts/templates is the virtual path to your template files
bundles.Add(new Bundle("~/bundles/templates", new HandlebarsTransformer())
.IncludeDirectory("~/Scripts/templates", "*.hbs", true)
);
BundleTable.EnableOptimizations = true;
}
}
// this should be after the Ember framework
@Scripts.Render("~/bundles/templates")
This use case is you want the templates injected into the page, but not precompiled/minified/bundled, just inject em
using HandlebarsHelper;
// this should be after the Ember framework
// "~/scripts/templates" is the virtual path to the templates
// new[] { "*.hbs" } is the filter extension array (add as many as you want)
@HandlebarsHelper.RawTemplateInjector.InjectRawTemplates("~/scripts/templates", new[] { "*.hbs" })
Template naming is an area of controversy, I have my opinion, you have yours, and mine is right ;)
There are a few different scenarions that render differently
Path from included directory | File name | Template name | Scenario |
/ | apple.hbs | apple | file in the root |
/blah/ | blah.hbs | blah | file in folder and matches the folder name(exact match) |
/blah/ | cow.hbs | blah/cow | file in folder, and doesn't match the folder name |
/dog/ | Dog.hbs | dog/Dog | file in folder, and doesn't match the folder name |
/dog/ | elephant.hbs | dog/elephant | file in folder, and doesn't match the folder name |
That's cool, The HandlebarsTransformer
and RawTemplateInjector
take an optional parameter which allow you to define a class that names your templates!
Create a new class and implement the ITemplateNamer
interface
public interface ITemplateNamer
{
string GenerateName(string bundleRelativePath, string fileName);
}
What is passed in? If you look up above, at the table, column 1 and 2, that's it. The template's relative path and the template's file name.
Example custom namer:
public class CustomTemplateNamer : ITemplateNamer
{
public string GenerateName(string bundleRelativePath, string fileName)
{
var fileNameNoExtension = Path.GetFileNameWithoutExtension(fileName);
return "moooooooooooo" + fileNameNoExtension;
}
}
bundles.Add(new Bundle("~/bundles/templates", new HandlebarsTransformer(new CustomTemplateNamer()))
.IncludeDirectory("~/Scripts/templates", "*.hbs", true)
);
@HandlebarsHelper.RawTemplateInjector.InjectRawTemplates("~/scripts/templates",
new[] { "*.hbs" },
new CustomTemplateNamer());
Report all issues, feel free to submit PRs, clean up the code, make the readme more coherent, stylize my example page.
Another example can be found here: https://github.com/kingpin2k/Zoo
For HTMLBars see https://github.com/kingpin2k/HTMLBarsHelper