iT邦幫忙

2018 iT 邦幫忙鐵人賽
DAY 7
1
Modern Web

ASP.NET MVC網頁程式介紹系列 第 7

[Day 07] ASP.NET MVC後端傳資料到前端介紹(三)

今天繼續前兩天的話題,我們用ViewBag總共傳了三個物件,第一個是C#預設的DateTime物件,
cs檔案

DateTime date = DateTime.Now;
ViewBag.Date = date;

cshtml檔案

@{
    var date = ViewBag.Date;
}
<div>
    現在時間: @date.ToString("yyyy/MM/dd HH:mm:ss") 
</div>

在MVC中要呼叫後端的物件,就要使用@這個標記,在最前面的@ { }跟呼叫物件時的@date都是如此,MVC前端是使用Razor的語法,不過基本上可以將C#的語法完全搬到前端來使用,只是要記得加上@

第二個傳的物件是一個自訂的物件
cs檔案

Student data = new Student();
ViewBag.Student = data;

cshtml檔案

@{
    var student = ViewBag.Student;
}
<div>
    學生成績: @student.ToString()
</div>

因為我們在宣告的時候沒帶任何參數進去,所以出來的結果就會是預設值:空字串跟0

第三個傳的物件是自訂物件的List,List是C#預設的一個陣列,可以放任何物件
cs檔案

List<Student> list = new List<Student>();
list.Add(new Student("1", "小明", 80));
list.Add(new Student("2", "小華", 70));
list.Add(new Student("3", "小英", 60));
list.Add(new Student("4", "小李", 50));
list.Add(new Student("5", "小張", 90));

ViewBag.List = list;

cshtml檔案

@{
    var list = ViewBag.List;
}
<div>
    學生成績列表:
</div>
@for (int i = 0; i < list.Count; i++)
{
    <div>
        @list[i].ToString()
    </div>
}

這裡是通過迴圈來列出資料。

到今天是使用ViewBag傳遞資料到前端,明天開始會介紹通過Model傳遞資料到前端,Model不但可以傳遞資料到前端,也能夠從前端取資料到後端,不過前端到後端的部分會在稍後講到Get跟Post的地方介紹。

--
小弟不才,
如果有謬誤或是要補充的,
都歡迎一起來討論!


上一篇
[Day 06] ASP.NET MVC後端傳資料到前端介紹(二)
下一篇
[Day 08] ASP.NET MVC後端傳資料到前端介紹(四)
系列文
ASP.NET MVC網頁程式介紹30

1 則留言

0
yukondesu
iT邦新手 5 級 ‧ 2019-04-01 09:56:53

請問「這裡是通過迴圈來將」<這句話有漏什麼嗎@@?

小魚 iT邦高手 1 級‧ 2019-04-01 15:03:59 檢舉

看起來是少了什麼,
不過其實我也忘了當時要說什麼了...

我要留言

立即登入留言