Multiple Model in Single View

Model
Controller, View - 1
Controller, View - 2
Controller, View - 3
Controller, View - 4
Controller, View - 5
Controller, View - 6

ASP.NET MVC 뷰(single view)에 여러 모델을 바인딩하는 예제이다. 하나의 Controller로 작성하여 Partial View 활용까지 6가지 정도의 방법(WebGentle 2018)을 기술하였다. (.NET Core 3.0)

ViewModel
Dynamic Model (ExpandoObject)
Tuples
ViewBag
ViewData
Partial View

아래의 소스는 편의상 컨트롤러와 모델, 뷰는 공통으로 사용하고 Partial View 예제에 두 개의 뷰를 추가하였다.

Model

public class Employee
{
    public int ID { get; set; }
    public string Name { get; set; }
    public string Email { get; set; }
}

public class Student
{
    public int ID { get; set; }
    public string Name { get; set; }
    public string Email { get; set; }
}

public class EmployeeStudentViewModel 
{
    public Employee Employee { get; set; }
    public Student Student { get; set; }
    public List<Employee> Employees {get; set;}
    public List<Student> Students {get; set;}
}

Controller, View - 1

// 1.ViewModel
public IActionResult Index()
{
    var students = GetStudent().ToList();
    var employees = GetEmployees().ToList();
    var model = new EmployeeStudentViewModel() {Students = students, Employees = employees};
    return View(model);
}

// 이하 공통
private IEnumerable<Employee> GetEmployees()
{
    return new List<Employee>
    {
        new Employee {ID = 11, Name = "aaa", Email = "aaa@gmail.test"},
        new Employee {ID = 21, Name = "bbb", Email = "bbb@gmail.test"},
        new Employee {ID = 31, Name = "ccc", Email = "bbb@gmail.test"}
    };
}

private IEnumerable<Student> GetStudent()
{
    return new List<Student>
    {
        new Student {ID = 12, Name = "ddd", Email = "ddd@gmail.test"},
        new Student {ID = 22, Name = "eee", Email = "eee@gmail.test"},
        new Student {ID = 32, Name = "fff", Email = "fff@gmail.test"}
    };
}

@model IndexViewModel

@foreach (var employee in Model.Employees)
{
    <h1>@employee.Name</h1>
}

@foreach (var student in Model.Students)
{
    <h1>@student.Name</h1>
}

Controller, View - 2

// 2.Dynamic Model(ExpandoObject)
public IActionResult Index()
{
    var students = GetStudent();
    var employees = GetEmployees();
    dynamic model = new ExpandoObject();
    model.Employees = employees;
    model.Students = students;
    return View(model);
}

@model dynamic

@foreach (var employee in Model.Employees)
{
    <h1>@employee.Name</h1>
}

@foreach (var student in Model.Students)
{
    <h1>@student.Name</h1>
}

Controller, View - 3

// 3.Tuples
public IActionResult Index()
{
    var students = GetStudent().ToList();
    var employees = GetEmployees().ToList();
    var model = new Tuple<IList<Employee>, IList<Student>> (employees, students);
    return View(model);
}

@model Tuple<IList<Employee>, IList<Student>>

@foreach (var employee in Model.Item1)
{
    <h1>@employee.Name</h1>
}

@foreach (var student in Model.Item2)
{
    <h1>@student.Name</h1>
}

Controller, View - 4

// 4.ViewBag
public IActionResult Index()
{
    var students = GetStudent();
    var employees = GetEmployees();
    ViewBag.Employees = employees;
    ViewBag.Students = students;
    return View();
}

@foreach (var employee in ViewBag.Employees)
{
    <h1>@employee.Name</h1>
}

@foreach (var student in ViewBag.Students)
{
    <h1>@student.Name</h1>
}

Controller, View - 5

// 5.viewData
public IActionResult Index()
{
    var students = GetStudent();
    var employees = GetEmployees();
    ViewData["Employees"] = employees;
    ViewData["Students"] = students;
    return View();
}

@foreach (var employee in ViewData["Employees"] as IList<Employee>)
{
    <h1>@employee.Name</h1>
}

@foreach (var student in ViewData["Students"] as IList<Student>)
{
    <h1>@student.Name</h1>
}

Controller, View - 6

// 6.Partial Views
public IActionResult Index()
{
    var model = new EmployeeStudentViewModel()
    {
        Employees = GetEmployees().ToList(), Students = GetStudent().ToList()
    };
    return View(model);
}

<!-- Index.cshtml -->
@model EmployeeStudentViewModel
<partial name="_Employee" for="Employees"/>
<partial name="_Student" for="Students"/>

<!-- _Employee.cshtml -->
@model IEnumerable<Employee>
<h1>Employee Page</h1>
@foreach (var item in Model)
{
    <div class="row" style="border: solid 1px black; margin: 4px">
        <div class="col-lg-6" style="display: table-cell">
            <h2>Name - @item.Name</h2>
            <p>ID - @item.ID</p>
            <p>Email - @item.Email</p>
        </div>
        <div class="col-lg-6">
            <h2>&nbsp;</h2><p>&nbsp;</p>
            <p>Model Name - @item.GetType().Name</p>
        </div>
    </div>
}

<!-- _Student.cshtml -->
@model IEnumerable<Student>
<h1>Student Page</h1>
@foreach (var item in Model)
{
    <div class="row" style="border: solid 1px black; margin: 4px">
        <div class="col-lg-6">
            <h2>Name - @item.Name</h2>
            <p>ID - @item.ID</p>
            <p>Email - @item.Email</p>
        </div>
        <div class="col-lg-6">
            <h2>&nbsp;</h2><p>&nbsp;</p>
            <p>Model Name - @item.GetType().Name</p>
        </div>
    </div>
}