我有一个MVC应用程序,我正在使用各种JsonResult端点来填充
javascript viewmodel.
我一直在使用几个jQuery Ajax请求来填充模型,但我希望将尽可能多的初始模型传递给服务器上的视图.
viewmodel有3-5个部分(取决于用户在应用程序中的位置):
>基本页面链接,这些链接不会经常更改,并且可能在整个用户的会话中完全相同
>用户通知.
>用户数据.
>(可选)可视数据
>(可选)misc数据
我目前正在使用此代码加载前三个部分:
$(document).ready(function () { ko.applyBindings(viewmodel); @Html.Raw(ViewBag.Script) // Piece 1. Almost always the same thing postJSON('@Url.Action("HomeviewmodelJson","Home")',function (data) { if (data == null) return; for (var i in data.Tabs) { viewmodel.tabs.push({ name: data.Tabs[i] }); } for (var i in data.Buttons) { viewmodel.metroButtons.push({ name: data.MetroButtons[i] }); } for (var i in data.Ribbons) { viewmodel.ribbons.push(data.Ribbons[i]); } ApplyButtonThemes(); }); }); // Piece 2. Changes constantly. OK as is postJSON('@Url.Action("GetNotifications","NotificationAsync")',function (nots) { viewmodel.notifications.removeAll(); ko.utils.arrayForEach(nots,function (item) { item.readNotification = function () { hub.markNotificationAsRead(this.Id); return true; }; viewmodel.notifications.push(item); }); }); // Piece 3. Changes but should also be loaded at startup postJSON('@Url.Action("GetUser","UserAsync")',function (user) { viewmodel.user(koifyObject(user)); }); postJSON = function(url,data,callback) { if($.isFunction(data)) { callback = data; data = {}; } $.ajax({ 'type': 'POST','url': url,'contentType': 'application/json','data': ko.toJSON(data),'dataType': 'json','success': callback }); };
我尝试过这样的事情,但我发现使用@ Html.Action(“HomeviewmodelJson”,“Home”)会导致HTTP标头被更改,整个页面就像JSON一样被发送
(function (data) { if (data == null) return; for (var i in data.Tabs) { viewmodel.tabs.push({ name: data.Tabs[i] }); } for (var i in data.MetroButtons) { viewmodel.metroButtons.push({ name: data.MetroButtons[i] }); } for (var i in data.Ribbons) { viewmodel.ribbons.push(data.Ribbons[i]); } ApplyMetroButtonThemes(); })('@Html.Action("HomeviewmodelJson","Home")');
我想做的是在将页面发送给用户之前,使用现有的JsonResult端点将Json数据放入服务器端的viewmodel中.
是否有任何选项可以让我这样做而无需重写我的控制器?
解决方法
渲染主视图时,您正在使用视图模型,对吧?在此视图模型中,只需填充您不希望在返回视图之前使用AJAX获取的属性:
public ActionResult Index() { Myviewmodel model = ... model.Prop1 = ... model.Prop2 = ... return View(model); }
例如,如果您有以下用于AJAX请求的操作:
public JsonResult GetProp1() { Property1viewmodel model = ... return Json(model,JsonRequestBehavior.AllowGet); }
您可以在主操作中使用它来填充单个属性:
model.Prop1 = (Property1viewmodel)GetProp1().Data; model.Prop2 = (Property2viewmodel)GetProp2().Data;
然后在相应的视图中,您可以使用Json.Encode方法将整个模型序列化为JSON字符串:
@model Myviewmodel <script type="text/javascript"> var model = @Html.Raw(Json.Encode(Model)); // You could use model.Prop1 and model.Prop2 here </script>
@model Myviewmodel <script type="text/javascript"> var prop1 = @Html.Raw(Json.Encode(Model.Prop1)); </script>