javascript - 在 Javascript 中使用 View 模型

Question

场景:

部分 View 有一个模型，我需要在单独的 .js 文件中的 javascript 中使用模型中的值。

目前，我正在使用内联 javascript 以便可以使用模型中的值，但是如果将 javascript 移动到单独的文件中怎么办。在这种情况下，我如何获得这些值。

代码

@model IEnumerable<BookSpec.DomainEntities.ContactModel.ContactDataModel>
<label for="SpecFinder">Contact</label>
<select id="SpecFinder" name="state">
@foreach (var name in Model)
{
    <option value="@name.GroupID">@name.GroupName</option>
}
</select>

<script type="text/javascript">
    $(document).ready(function () {
        $("#SpecFinder").change(function(){
            getData(this.value,'@Model.ProductID');
        });
    })
</script>

这是我当前的示例代码，我想将内联 javascript 完全移动到一个单独的文件中。我该怎么做，我还需要模型中的值。

Answer 1

在 View 上声明全局 javascript 变量 model，如下所示。然后您可以在任何地方使用它。

<script type="text/javascript">
    var model = @Html.Raw(Json.Encode(Model));
</script>

我会推荐使用上面的解决方案。但是如果您仍然不想在局部 View 中包含任何脚本，那么您可以在任何隐藏的 div 中呈现 model。并访问其文本并使用 JSON.parse 将其转换为 object，如下所示。像下面这样的代码不是一个好的做法并且像补丁工作。

HTML

<div id="model" style="display:none;">
    @Html.Raw(Json.Encode(Model))
</div>

脚本

var model = JSON.parse($("#model").text());