首页 > 解决方案 > 如何在 ASP.NET MVC 的剃刀视图中使用多个单独的模型?

问题描述

我目前正在开发一个项目,我想在其中显示 2 个具有不同模型的 webgrid 表。我发现了很多教程如何在常规 MVC 视图中使用多个模型,但它在 Razor 视图中不起作用。我现在有点坚持。

到目前为止我尝试过的 - 1

控制器:

我尝试使用动态 ExpandObject 向此视图添加两个列表,查看代码:

public ActionResult Index(int page = 1, string sortApi = "ApiName",string sortCompany = "CompanyName", string sortdir = "asc", string search = "")
{
        int pageSize = 13;
        int totalRecords = 0;
        if (page < 1)
        {
            page = 1;
        }
        int skip = (page * pageSize) - pageSize;
        ViewBag.TotalRows = totalRecords;
        ViewBag.search = search;

        //Dynamic ExpandObject
        var dataApiRedirects = getRedirects(search, sortApi, sortdir, skip, pageSize, out totalRecords);
        var dataCompanies = getCompanies(search, sortCompany, sortdir, skip, pageSize, out totalRecords);
        dynamic mymodel = new ExpandoObject();
        mymodel.ApiList = dataApiRedirects;
        mymodel.CompanyList = dataCompanies;

        return View(mymodel);
}

看法:

<div class="col-sm-1 d-flex align-items-stretch" style="padding-top: 5%;">
                <div class="form-group">
                    <a href="#" class="btn btn-primary" data-toggle="modal" data-target="#myModal">+API</a>
                </div>
                <!--MODAL-->
                <div class="modal fade" id="myModal" >
                    <div class="modal-dialog" style="width: 20%;">
                        <div class="modal-content">
                            <div class="modal-header">
                                <a href="#" class="close" data-dismiss="modal">&times;</a>
                                <h3 class="modal-title">Add API</h3>
                            </div>
                            <div class="modal-body">
                                <form id="myForm">
                                    <p>@Html.TextBoxFor(Model.ApiList.ApiName, new { @class = "form-control", @placeholder = "Name" })</p>
                                    <p>@Html.TextBoxFor(model => model.ApiList.First().Company.CompanyName, new { @class = "form-control", @placeholder = "Company" })</p>
                                    <p>@Html.TextBoxFor(model => model.ApiList.First().ApiURL2, new { @class = "form-control", @placeholder = "URL" })</p>
                                </form>
                            </div>
                            <div class="modal-footer">
                                <a href="#" class="btn btn-default" data-dismiss="modal">Cancel</a>
                                <input type="reset" value="Submit" class="btn btn-success" id="btnSubmit" />
                            </div>
                        </div>
                    </div>
                </div>
 </div>

但是,当我想在我的模式中创建文本框时,我收到以下错误:

在此处输入图像描述

到目前为止我尝试过的 - 2

我也尝试过使用 ViewBag:

控制器代码:

public ActionResult Index(int page = 1, string sortApi = "ApiName",string sortCompany = "CompanyName", string sortdir = "asc", string search = "")
{
        int pageSize = 13;
        int totalRecords = 0;
        if (page < 1)
        {
            page = 1;
        }
        int skip = (page * pageSize) - pageSize;

        var dataApiRedirects = getRedirects(search, sortApi, sortdir, skip, pageSize, out totalRecords);
        var dataCompanies = getCompanies(search, sortCompany, sortdir, skip, pageSize, out totalRecords);
        dynamic mymodel = new ExpandoObject();
        mymodel.ApiList = dataApiRedirects;
        mymodel.CompanyList = dataCompanies;

        //Model 1 data
        ViewBag.CompaniesList = dataCompanies;


        ViewBag.TotalRows = totalRecords;
        ViewBag.search = search;

        //Model 2 data
        return View(mymodel);
}

HTML 代码:

var getlist = ViewBag.CompaniesList as IEnumerable<APIBrokerFrontend.Models.Company>;

<div class="modal fade" id="myModalCompany">
                <div class="modal-dialog" style="width: 20%;">
                    <div class="modal-content">
                        <div class="modal-header">
                            <a href="#" class="close" data-dismiss="modal">&times;</a>
                            <h3 class="modal-title">Add Company</h3>
                        </div>
                        <div class="modal-body">
                            <form id="myForm">
                                @<p>@Html.TextBoxFor(getlist.First().CompanyName, new { @class = "form-control", @placeholder = "Company Name" })</p>
                            </form>
                        </div>
                        <div class="modal-footer">
                            <a href="#" class="btn btn-default" data-dismiss="modal">Cancel</a>
                            <input type="reset" value="Submit" class="btn btn-success" id="btnSubmit" />
                        </div>
                    </div>
                </div>
</div>

使用 ViewBag 我收到以下错误:

在此处输入图像描述

有人对此有解决方案吗?

提前致谢!

标签: c#asp.netrazordata-bindingview

解决方案


问题是使用了类似的操作First()这里解释了使用动态模型的正确方法。请更正您的代码以使用索引 0(例如ApiList[0])来获取第一个元素而不是 First().

使用动态的例子:

看法:

@using Sample;

@model dynamic

@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<h2>Index</h2>

<a href="~/Default1">@Model.Blogs[0].MyCompany.CompanyName</a>

控制器:

public class Company
{
    public string CompanyName { get; set; }
}

public class Blog
{
    public string Name;
    public string URL;
    public Company MyCompany;
}

public class MyModel
{
    public List<Blog> Blogs { get; set; }
}

public class Default1Controller : Controller
{
 public class Company
{
    public string CompanyName { get; set; }
}

public class Blog
{
    public string Name;
    public string URL;
    public Company MyCompany;
}

public class MyModel
{
    public List<Blog> Blogs { get; set; }
}

public class Default1Controller : Controller
{
    List<Blog> topBlogs = new List<Blog>
      { 
          new Blog { Name = "ScottGu", URL = "http://weblogs.asp.net/scottgu/", MyCompany = new Company{
              CompanyName = "Microsoft"
          }},
          new Blog { Name = "Scott Hanselman", URL = "http://www.hanselman.com/blog/", MyCompany = new Company{
              CompanyName = "Microsoft"
          }},
          new Blog { Name = "Jon Galloway", URL = "http://www.asp.net/mvc", MyCompany = new Company{
              CompanyName = "Microsoft"
          }}
      };

    //
    // GET: /Default1/

    public ActionResult Index()
    {
        var myModel = new MyModel();
        myModel.Blogs = topBlogs;

        return View(myModel);
    }

}

希望有帮助。


推荐阅读