这是我将模型发送到角度控制器范围的方式。
c＃控制器：
public class AreaMenuController : RootController
{
// GET: Menu
public PartialViewResult Index()
{
var mod = Modules.Instance.ModuleList.FirstOrDefault(m => m.Prefix.Equals(base.GetArea(), StringComparison.CurrentCultureIgnoreCase));
return PartialView("_AreaMenu", mod.ModuleMenus);
}
}
查看cshtml：
@using Nuclei.Models
@model IEnumerable<Nuclei.Models.Menu>
<script type="text/javascript">
@{ var serializer = new System.Web.Script.Serialization.JavaScriptSerializer(); }
window.areaMenus = @Html.Raw(serializer.Serialize(Model));
</script>
<script type="text/javascript" src="@Url.Content("~/Scripts/AngularControllers/_AreaMenuController.js")"></script>
<div ng-controller="AreaMenuController as vm" ng-init="vm.initializeController()">
<div id="accordion" ng-class="accordian-menu" style="visibility: visible;">
<ul>
<li ng-repeat="menu in vm.areaMenus">
...
</li>
</ul>
</div>
</div>
Angular Js文件：
var NucleiApp = angular.module('NucleiApp');
NucleiApp.controller('AreaMenuController', ['$scope', '$http', '$location', function ($scope, $http, $location) {
"use strict";
var vm = this;
vm.initializeController = function () {
vm.areaMenus = window.areaMenus;
}
}]);
问题1：除了通过全局窗口对象之外，是否有更平滑的方式将c＃模型发送到角度？
您可以使用来自angular的$ http get，但是因为这是在客户端处理的，所以在显示之前总是有一点滞后，因为它需要调用c＃controller并获取数据。所以我只保留$ http获取更新。
我想的另一种方式是直接发送视图Json对象：
c＃控制器：
public class AreaMenusController : RootController
{
// GET: Menu
public PartialViewResult Index()
{
return PartialView("_AreaMenu", GetAreaMenus());
}
public JsonResult GetAreaMenus()
{
var mod = Modules.Instance.ModuleList.FirstOrDefault(m => m.Prefix.Equals(base.GetArea(), StringComparison.CurrentCultureIgnoreCase));
return Json(new { areaMenus = mod.ModuleMenus }, JsonRequestBehavior.AllowGet);
}
}
查看cshtml：
@using System.Web.Mvc
@model JsonResult
<script type="text/javascript">
window.areaMenus = @Model;
</script>
问题2：我不确定如何在此时初始化@model并将其发送到angular文件并再次，如果有比javascripts全局窗口对象更好的选项...打开建议！
我们目前这样做是为了引导一组数据，这些数据稍后通过调用更新到WebAPI中。
我们这样做的原因是我们已经发现这样的情况：当通过API调用引导时，数据回复得太慢，这给我们的用户带来了糟糕的体验。
在我们的剃刀视图中：
<html>
<head>
<script>
window.areaMenus = '@Html.Raw(Model.SerializedJsonString)';
</script>
</head>
</html>
然后，当我们的角应用程序是Run()时，我们反序列化数据，并从那里使用它：
var app = angular.module('myApp', ["stuff"])
.run(["menuService", (menuService) => {
// deserialize the json string into my object
var areaMenus = angular.fromJson(window.areaMenus);
// do something with it
menuService.Load(areaMenus);
}]);
这将立即获得角度数据，而无需等待$http请求完成，这应该解决您的问题。