MVC后台數據賦值給前端JS對象

Controller中的數據，不管是使用的是ViewModel 還是ViewBag.Data，要將他傳遞到View中，這個很容易，但是如果要將它傳遞給JS中的某個對象，這個改如何處理呢？

后台的數據格式：

    public class ViewModel
    {
        public int ID { get; set; }

        public string Name { get; set; }

        public List<string> Data { get; set; }
    }

Controller 傳遞到View的數據：

        public ActionResult Index()
        {
            ViewBag.ID = 1;
            ViewBag.Name = "WWW";
            ViewModel viewModel = new ViewModel()
            {
                ID = 100,
                Name = "WWW",
                Data = new List<string> {"A","B","C","D","E" }
            };
            return View(viewModel);
        }　

前台JS 中的一個對象

    var viewModel = {
        id: 0,
        name: '',
        data:[]
    }

　　

1. 如果需要傳遞整形數字到JS中 

<script>
        viewModel.id=@ViewBag.ID;
        or
        viewModel.id=@Model.ID;
</script>

2.  如果需要傳遞字符串到JS中

<script>        
        viewModel.name='@ViewBag.Name';
        or
        viewModel.name='@Model.Name';  
</script>  

3.如果需要傳遞復雜的數據類型到JS中，如對象，數組，集合等，

<script>
        viewModel.data = @Html.Raw(Json.Encode(Model.Data));
</script>

 

更多方法請參見：http://stackoverflow.com/questions/3850958/pass-array-from-mvc-to-javascript

另外將JS 中的對象傳遞到Controller中，這個直接采用Ajax，就可以實現，詳細請參見 　http://stackoverflow.com/questions/16824773/passing-an-array-of-javascript-classes-to-a-mvc-controller