javascript - 通过 javascript 使用视图模型和 Razor

Question

我有一个包含“歌曲”列表的视图模型。现在我不想让视图遍历所有列表，所以在 java 脚本中我做了：

$(window).scroll(function () {
    if ($(window).scrollTop() + $(window).height() + 5 > $(document).height()) {    
        @foreach (var item in Model.Songs.Skip(Number).Take(20))
        {
             //do something
        }
        Number = Number + 20;
    }
});

问题是 Razor 变量“数字”没有改变，所以我总是加载相同的条目。我不想每次滚动条到达底部时都进行 ajax 调用，我已经有了我的页面模型，我只是不想立即使用所有这些。

Answer 1

我认为实现这一点的最佳方法是将模型集合解析为 javascript 对象（数组）

首先，您需要创建 html 辅助方法（无论如何在其他情况下都会有用），例如

  using Newtonsoft.Json;
   .....
     public static HtmlString ToJson(this HtmlHelper helper, object obj)
     {
         return MvcHtmlString.Create(JsonConvert.SerializeObject(obj));
     }

然后将您的模型属性转换为 js 对象。

<script>
    var songs = @Html.ToJson(Model.Songs.Skip(Number).Take(20))
</script>

就这样。为我工作。