2012-03-14 66 views
7

我正在使用客户端上的mustache.js和ASP.NET MVC3项目中的Nustache在服务器和客户端之间共享小胡子/ nustache模板。 ASP.NET MVC

我在服务器上一个视图文件夹,我用这样的Person.mustache模板:

@Html.Partial("Person") 

从剃刀主视图(Index.cshtml)。

但是,我怎样才能将它转移到客户端?浏览器无法访问“视图”文件夹以获取模板的原始内容。不知何故,我必须有一种方法来包含在服务器上输出Person.mustache模板的HTML原始文本。如果我从Razor视图需要它,它会编译它,因为它是普通的服务器模板引擎。

请任何人都可以提供任何想法?谢谢。

回答

3

嗯,我已经做了一些事情,那可行,也许有人会想出更好的解决方案。那就是:

为@Html帮手

Extenstion:

public static class ViewExtensions 
{ 
    public static IHtmlString RenderRawContent(this HtmlHelper helper, string serverPath) 
    { 
     string filePath = HttpContext.Current.Server.MapPath(serverPath); 

     //load from file 
     StreamReader streamReader = File.OpenText(filePath); 
     string markup = streamReader.ReadToEnd(); 
     streamReader.Close(); 

     return new HtmlString(markup); 

    } 
} 

而且在剃刀索引页

@using MyProject.Helpers; 

<script type="text/template" id="person_template"> 

    @Html.RenderRawContent("~/Templates/Person.mustache") 

</script> 
1

您可能想要公开一个可以返回部分视图内容的新控制器。例如:

public class TemplateController : Controller 
{ 
    public PartialViewResult Get(string name) 
    { 
    return PartialView(name); 
    } 
} 

了,并且路线:

routes.MapRoute("Templates", "templates/{name}", 
    new { controller = "Template", action = "Get" }); 

然后我就可以从客户端调用(在这个例子中,我使用jQuery):

var model = { name: "Matt" }; 
$.ajax({ 
    url: "/templates/person", 
    success: function(r) { 
    var html = Mustache.render(r, model); 
    $("body").append(html); 
    } 
}); 
+0

不能让这个工作。什么名称空间“部分”类在?我发现只有“PartialView”,但它用给定的模型编译模板 – Roman 2012-03-14 17:23:42

+0

感谢您的编辑。但PartialView“创建一个呈现部分视图的PartialViewResult对象” - 来自http://msdn.microsoft.com/zh-cn/library/system.web.mvc.controller.partialview.aspx,当我需要模板的原始内容时与所有{{}}符号 – Roman 2012-03-16 10:01:36

0

文件命名为Person.mustache.cshtml主视图,并在Index.cshtml

<script type="text/template" id="person_template"> 
    @Html.Partial("Person.mustache") 
<script type="text/template" id="person_template"> 

当框架做到这一点时,不需要编写一个帮助器来提供文件你呢。

+0

使用该方法我不能使用Person.mustache作为服务器模板,如果我将它重命名为这样 – Roman 2012-05-19 04:53:33

相关问题