我希望部分视图和索引视图中的模型不同

Question

他们想让我让页面动态化。页面中有slider、galery、form和subscribe部分。我需要将这些分区与数据库相关联。我把这些部分分成了分音。我在索引视图中插入了滑块部分，因为它只在主页上。

@model IEnumerable<SekizgenApplication.Models.Slider>
    @{
    ViewBag.Title = "Home Page";
}

<div class="justics-holder">

    <div id="carousel-example-generic102" class="carousel slide" data-ride="carousel">


        <!-- Wrapper for slides -->

        <div class="carousel-inner" role="listbox">

            @foreach (var item in Model)
            {
                if (@item.Active == true)
                {
                    <div class="item active">
                        <div class="justices-img">
                            <img src="~/Slider/@item.sliderDosyaYolu" width="700" height="600" alt="image" class="img">
                        </div>
                    </div>
                }

                <div class="item">
                    <div class="justices-img">
                        <img src="~/Slider/@item.sliderDosyaYolu" width="700" height="600" alt="image" class="img">
                    </div>
                </div>
            }


        </div>


        <a class="left carousel-control prev-2" href="#carousel-example-generic102" role="button" data-slide="prev">

            <span><i class="fa fa-angle-left" aria-hidden="true"></i></span>

            <span class="sr-only">Geri</span>

        </a>

        <a class="right carousel-control next-2" href="#carousel-example-generic102" role="button" data-slide="next">

            <span><i class="fa fa-angle-right" aria-hidden="true"></i></span>

            <span class="sr-only">İleri</span>

        </a>

    </div>

</div>

我为图库部分创建了部分。顺便说一下，我在数据库中为每个部分创建了一个表。Galery区段代码如下：

@model IEnumerable<SekizgenApplication.Models.Galery>

<div class="page-section black">
    <div class="gallery">
        <div class="container">
            <div class="row">
                <div class="gallery-heading">
                    <h1>EĞİTİM KURUMUZDAN KARELER</h1>
                    <p></p>
                </div>
                <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
                    <div class="carousel-inner" role="listbox">


                        <div class="item active">
                            <div class="row">
                                @foreach (var item in Model)
                                {
                                    <div class="col-sm-4 col-xs-12">
                                        <div class="gallery-img">
                                            <img src="~/Galery/@item.picDosyaYolu" width="360" height="350" alt="image">
                                        </div>
                                    </div>
                                }


                            </div>
                        </div>

                    </div>
                </div>
                <div class="control-box">
                    <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
                        <span><i class="fa fa-angle-left" aria-hidden="true"></i></span>
                        <span class="sr-only">Geri</span>
                    </a>
                    <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
                        <span><i class="fa fa-angle-right" aria-hidden="true"></i></span>
                        <span class="sr-only">İleri</span>
                    </a>
                </div>
            </div>
        </div>
    </div>
</div>

将此部分galery部件添加到布局时出现了问题。

@Html.Partial("_GaleryPartial")

当我添加这个时，我得到了一个错误，因为索引与一个模型不同，部分模型也不同。我们如何解决这个问题？

Answer 1

要做到这一点，一种方法是为您的主页创建第三个视图模型，其中包含您的两个现有模型作为属性(或者您希望在该屏幕上显示多少个视图模型/部分)

新的视图模型可能如下所示：

public class MainVm 
{
    public IEnumerable<SekizgenApplication.Models.Slider> Sliders { get; set; }
    public IEnumerable<SekizgenApplication.Models.Galery> Galeries { get; set; }
}

然后，您可以将这些属性从cshtml页面传递给您的部分参数，如下所示：

@model SekizgenApplication.Models.MainVm

@Html.Partial("_GaleryPartial", Model.Galeries)
@Html.Partial("_SliderPartial", Model.Sliders)

这应该可以解决你得到的错误。