如何使用控制器对象创建JS

Question

在我的实际任务中，我需要基于ASP.NET MVC为应用程序创建图形。我找到了合适的JS，但是我强迫了一个问题如何从控制器中创建的值创建JS对象。例如：

public class User
{
    public string Name { get; set; }
    public string Group { get; set; }
}
   public ActionResult Index()
    {
        List<User> users = new List<User>()
        {
            new User{Name = "Boss", Group = "Boss"},
            new User{Name = "Emp 1", Group = "Emps"},
            new User{Name = "Emp 2", Group = "Emps"},
            new User{Name = "Emp 3", Group = "Emps"},
            new User{Name = "Emp 4", Group = "Emps"},
        };
        ViewBag.Users = users;
        return View();
    }

我在控制器中收集了User。下面的JS代码，我需要创建

var nodes = [
    { "name": "Boss", "group": "Boss" },
    { "name": "Emp 1", "group": "Emps" },
    { "name": "Emp 2", "group": "Emps" },
    { "name": "Emp 3", "group": "Emps" },
    { "name": "Emp 4", "group": "Emps" },
];

我想创建JS代码，例如

var nodes = function () {
        var array = [];
        for (var i = 0; i < @ViewBag.Users.Count; i++) {
            array.push({"name": @ViewBag.Users[i].Name, "group": @ViewBag.Users[i].Group})
        }
        return array;
   };

P.S。此代码由于i不存在而无法工作。

Answer 1

我认为您的问题有更好的方法。您正在询问如何在视图中从控制器中传递值。您的方法将起作用，但是将对象作为视图的模型将对象传递要简单得多。当您返回视图((时，您需要传递包含列表的对象。像这样： return View(users);然后，您需要注册模型 @model IEnumerable<User>()之后，使用简单的foreach，您可以迭代模型并显示值：

@foreach(var item in Model){
    //do whatever you want with the item
}

如果您需要模型元素到您的节点变量中，则可以这样做：

<script>
var nodes = @Html.Raw(Json.Encode(Model))
</script>

Answer 2

您可以使用以下代码实现此目的。

var nodes = function () {
  var array = [];
  @for(int i = 0; i < 5; i++) {
     <text>
       array.push({"name": "@ViewBag.Users[i].Name", "group": "@ViewBag.Users[i].Group"})
     </text>
  }
  return array;
}

尝试使用<text></text>

围绕JS

参考：如何在JavaScript脚本标签中使用剃须刀？

Answer 3

您可以将用户列表序列化为JSON对象。我认为这就是您的结果。最简单的方法。

ViewBag.Users = JsonConvert.SerializeObject(users);

我已经创建了一个带有您的示例的.NET小提琴。请在这里检查。

您需要为此代码包含newtonsoft.json nuget软件包。如果您不想使用此软件包，则可以使用JavaScriptSerializer.Serialize 方法来自System.Web.Scripts.Serialization。单击此处以获取更多信息。

Answer 4

var nodes= JSON.stringify(@Html.Raw(Json.Encode(ViewBag.Users)));