Q:

Retrieve data from ViewModel

I have 2 Models and 1 ViewModel for now. They are listed below. I would like to display all fields from my Employee Model along with the 2 fields from my Department Model on the Index Method. So, I created the ViewModel with all the fields along with adding a public IEnumerable<SelectListItem> DeptList { get; set; } for retrieving data to a DropDownList on my Create Method (which works fine).
Employee Model:
    public class Employee
{
    [Key]
    public int EmpId { get; set; }

    [Column(TypeName = "varchar(50)")]
    [MaxLength(50)]
    [Required(ErrorMessage = "First Name is Required")]    
    public string EmpFirstName { get; set; }

    [Column(TypeName = "varchar(50)")]
    [MaxLength(50)]
    [Required(ErrorMessage = "Last Name is required")]
    public string EmpLastName { get; set; }

    [Column(TypeName = "varchar(10)")]
    [DataType(DataType.PhoneNumber)]
    [MaxLength(10)]
    [Required(ErrorMessage = "Phone Number is required")]
    public string EmpPhoneNumber { get; set; }

    [Column(TypeName = "datetime2(7)")]
    [DataType(DataType.Date)]
    [Required(ErrorMessage = "Start Date is required")]
    [DisplayFormat(DataFormatString = "{0:D}")]
    public DateTime EmpStartDate { get; set; }

    public int DeptId { get; set; }
    public Department Department { get; set; }
}

Department Model:
    public class Department
{
    [Key]
    public int DeptId { get; set; }

    [Required(ErrorMessage = "Department Name is required")]
    [Column(TypeName = "varchar(50)")]
    [MaxLength(50)]
    public string DeptName { get; set; }

    public List<Employee> Employees { get; set; }
}

EmployeeViewModel:
I would like to create just this one ViewModel for my CRUD if possible.
    public class EmployeeViewModel
{
    public int EmpId { get; set; }
    public string EmpFirstName { get; set; }
    public string EmpLastName { get; set; }
    public string EmpPhoneNumber { get; set; }
    public DateTime EmpStartDate { get; set; }

    public int DeptId { get; set; }
    public string DeptName { get; set; }
    public IEnumerable<SelectListItem> DeptList { get; set; }
}

Employee Controller:
    public class EmployeeController : Controller
{
    private DataEntryContext _context;

    public EmployeeController(DataEntryContext context)
    {
        _context = context;
    }

    // GET: /<controller>/
    public IActionResult Index()
    {
        return View(_context.Employees.ToList());
    }

    // Retrieve List of Departments
    private IEnumerable<SelectListItem> GetDeptList()
    {
        var dept = _context.Departments
            .Select(s => new SelectListItem
            {
                Value = s.DeptId.ToString(),
                Text = s.DeptName
            })
            .ToList();

        return (dept);
    }

    public IActionResult Create()
    {
        EmployeeViewModel selectList = new EmployeeViewModel();
        selectList.DeptList = GetDeptList();

        return View(selectList);
    }

    [HttpPost]
    [ValidateAntiForgeryToken]
    public IActionResult Create(EmployeeViewModel employee)
    {
        if (ModelState.IsValid)
        {
            var emp = new Employee();

            {
                emp.EmpFirstName = employee.EmpFirstName;
                emp.EmpLastName = employee.EmpLastName;
                emp.EmpPhoneNumber = employee.EmpPhoneNumber;
                emp.EmpStartDate = employee.EmpStartDate;
                emp.DeptId = employee.DeptId;
            }

            _context.Employees.Add(emp);
            _context.SaveChanges();
            return RedirectToAction("Index");
        }
        return View(employee);
    }
}

View Index Method:
I added the @model IEnumerable<DataEntryMVC.Models.EmployeeViewModel> at the top of this view.
@foreach (var item in Model)
{
    <tr>
        <td>
            @Html.DisplayFor(modelItem => item.EmpFirstName)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.EmpLastName)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.EmpPhoneNumber)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.EmpStartDate)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.DeptName)
        </td>
        <td>
            @Html.ActionLink("Edit", "Edit", new { id = item.EmpId })
        </td>
    </tr>
}

Error Message that I receive when retrieving data:

An unhandled exception occurred while processing the request.
InvalidOperationException: The model item passed into the ViewDataDictionary is of type System.Collections.Generic.List`1[DataEntryMVC.Models.Employee], but this ViewDataDictionary instance requires a model item of type 'System.Collections.Generic.IEnumerable`1[DataEntryMVC.Models.EmployeeViewModel]'.

Also, am I handling the Create Method properly for Adding my Data to the Database?

A:

The error is self explanatory. Your view is strongly typed to a collection of EmployeeViewModel class( IEnumerable<EmployeeViewModel>), but in your action method, you are returning the list of Employee entities.
The solition is to convert the entity list to view model list and return that to the view. You can do that with LINQ Select method.
public IActionResult Index()
{
    var list=_context.Employees
                     .Select(s=> new EmployeeViewModel { 
                                                         EmpId =s.EmpId ,
                                                         EmpFirstName=s.EmpFirstName,
                                                         EmpLastName=s.EmpLastName,
                                                         EmpPhoneNumber=s.EmpPhoneNumber,
                                                         EmpStartDate=s.EmpStartDate,
                                                         DeptName=s.Department.DeptName
                                                       }).ToList();
    return View(list);
}

