MVC Razor在javascript视图中从控制器获取值

Question

我必须在视图中从控制器方法获取值以写入一些javascript.在网页中,它就像<%= functionName()%>一样简单.有没有办法在MVC中执行此操作.我无法使用该模型,因为javascript必须在页面加载时可用.任何见解都表示赞赏.

Answer 1

有没有办法在MVC中执行此操作

当然是.

我无法使用该模型,因为javascript必须在页面加载时可用.

当然,您可以使用视图模型,没有什么可以阻止您这样做.所以你首先要定义它:

public class MyViewModel
{
    public string Foo { get; set; }
}

然后有一个控制器动作,将填充此视图模型并将视图传递给它:

public ActionResult Index()
{
    var model = new MyViewModel();
    model.Foo = "Hello World"; 
    return View(model);
}

最后有一个强类型视图到这个视图模型,其中:

@model MyViewModel
<script type="text/javascript">
    $(function() {
        var foo = @Html.Raw(Json.Encode(Model.Foo));
        alert(foo);
    });
</script>

但现在让我们假设你不想用javascript污染你的视图,而是将它放在一个单独的js文件中(当然这是正确的方法).

您可以将值嵌入DOM中的某个位置,例如使用HTML5 data-*属性:

<div id="foo" data-model="@Html.Raw(Html.AttributeEncode(Json.Encode(Model)))">
    Click me to surprise you
</div>

然后在单独的javascript中订阅此元素的click事件并读取data-*我们在其中使用JSON序列化整个视图模型的属性:

$(function() {
    $('#foo').click(function() {
        var model = $(this).data('model');
        alert(model.Foo);
    });
});