Question

如何编写视图以首先显示一些属性（标题，日期等），然后显示项目列表，最后在下面显示一个总和，如下所示：

Title: [My shopping cart], created [Dec 1st, 2017]
[Product name] [Price]   [Quantity] [Line sum]
[Product #1]   [$ 10.00] x [1]    = [$ 10.00]
[Product #2]   [$ 13.00] x [3]    = [$ 39.00]
[Product #3]   [$ 16.00] x [2]    = [$ 32.00]
SUM                                 [$ 81.00]

我知道所有逻辑都应该在控制器或模型中发生，因此我不会在视图中做任何数学答案之后。：）

我的viewmodel看起来像这样：

public class ViewModelShoppingCart
{
    public string Title { get; set; }
    public DateTime CreateDate { get; set; }
    public List<ViewModelShoppingCartItem> ShoppingCartItems { get; set; }
    public decimal TotalSum => ShoppingCartItems.Sum(item => item.LineSum);
}

public class ViewModelShoppingCartItem
{
    public int ProductId { get; set; }
    public string ProductTitle { get; set; }
    public decimal ProductPrice { get; set; }
    public int Quantity { get; set; }
    public decimal LineSum => ProductPrice * Quantity;
}

我不确定我的viewmodel数据的数据是如何构建的。在我的想象中它包含一个带有一些属性字段的标题（不在列表中），后跟一个列表，如下所示：

single property: Title
single property: CreateDate
single property: TotalSum
List<ProductId, ProductTitle, ProductPrice, Quantity, LineSum>

我的想象力是否真实存在？

我想将视图作为_Layout.cshtml的部分视图调用，如下所示：

<div class="container body-content">
    @Html.Partial("_ShoppingCart.cshtml")
    @RenderBody()
</div>

我是否必须将@RenderBody（）内的其他模型/视图纳入concideration？他们会与部分观点冲突吗？

我尝试编写一个视图导致了几乎只是红色的波浪线：

@model IEnumerable<MyStore.Models.ViewModels.ViewModelShoppingCart>

<table>
    <tr>
        <td colspan="4">
            <h4>@Html.DisplayNameFor(model => model.Title)</h4>
        </td>
    </tr>
    @foreach (var item in Model)
    {
        <tr>
            <td>
                <a asp-action="Details" asp-route-id="item.ProductId">
                    @Html.DisplayFor(model => item.Title)
                </a>
            </td>
            <td>
                @Html.DisplayFor(Model => item.ShoppingCartItems)
            </td>
            <td>
                x <input type="text" size="1" value="@Html.DisplayFor(modelItem => item.ShoppingCartItemQuantity)" /> =
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.LinePrice)
            </td>
        </tr>
        }
        <tr class="divider"><td colspan="4"></td></tr>
        <tr>
            <td colspan="3"><strong>Sum</strong></td>
            <td>
                <strong>@Html.DisplayNameFor(model => model.Total)</strong>
            </td>
        </tr>
    </table>
</div>

如何使用单个属性和列表为viewmodel创建视图？

0 个答案: