从JS文件而不是视图调用操作(MVC 4)

Question

我使用的是MVC4。

在我的视图中，我可以简单地通过使用：@Url.Action来获取操作的url

现在我想用视图的所有javascript生成一个javascript文件，而不是把它全部写在视图中，问题是我不能再使用剃刀的东西了。

所以我的问题是，如何从javascript分隔的文件中获取操作的url？

Answer 1

您需要在视图中定义一个JavaScript变量，然后可以在脚本中使用该变量。显然，这必须首先声明。

我在布局页面上使用了一个帮助器，它有所有这些变量，并为我想要的特定于某个页面的任何部分提供了一个部分。注意，这些将在body标记之前的任何其他脚本引用之前出现。

@Scripts.Variables()
@RenderSection("ScriptVariables", false)

Scripts.Variables是这样的

@helper Variables()
{
    <script language="javascript" type="text/javascript">
        var ActionGetallAdmin = '@Url.Action("GetAll", "Admin")';
        var ActionAccountLogin = '@Url.Action("Login", "Account")';
    </script>
}

Answer 2

我以前这样做的一种方法是创建服务于JS文件(实际上是CSS文件)的视图，而不是HTML文件。这利用了这样一个事实，即在MVC范例中，视图不一定总是HTML文件。

您可以通过为其创建一个控制器来完成此操作：

public class AssetController : Controller {

    protected void SetMIME(string mimeType) {

        // implementation largely removed
        this.Response.Headers["Content-Type"] = mimeType;
        this.Response.ContentType = mimeType;
    }

    // this will render a view as a Javascript file
    public void ActionResult MyJavascript() {

        this.SetMIME("text/javascript");
        return View();
    }

}

一旦你这样做了，你就可以创建一个视图(使用你通常在Javascript MVC中做的方式)，然后把它写成ASP.NET。记住不要使用布局，因为你显然不想要它。

MVC中的视图所提供的一切都是可用的，所以您可以随意使用模型等。

@model IList<Entity>
@{
    Layout = null;
}

(function ($) {

    // javascript!

    @foreach(var entity in Model) {
        $('#@entity.Id').on('click', function () {
            console.log('@entity.Name');
        });
    }

})(jQuery);

然后，您可以在其他视图中使用老式的Razor将其连接起来。

<script src="@Url.Action("MyJavascript","Asset")"></script>

它将会推出类似这样的东西

<script src="http://your.domain/asset/myjavascript"></script>

就像一种护身符。当然，视图是动态创建的，因此，如果您对此很挑剔，请务必小心。但是，因为它们是MVC控制器操作和视图，所以您可以像设置任何其他视图一样在它们上设置缓存选项。

Answer 3

嗯..。我认为你可以定义一个特殊的路由，比如"actionsjs"，它指向一个动作。

routes.MapRoute(name: "actionsJs",
                url: "actionsjs",
                defaults: new { controller = "Home", action = "GetActions" });

在操作中，您必须将内容设置为正确的类型：

Response.ContentType = "text/javascript";

然后，您将返回一个特定的视图，其中包含带有一些Razor的javascript代码。

@{
    Layout = "";
}

$(function() {
    var a = @(1 + 2);
});

此时，您可以将此“脚本文件”添加到您的站点中：

<script type="text/javascript" scr="@Url.Action("GetActions", "Home")"></script>

应该行得通。