将图片显示在分页列表中的问题

时间:2015-07-10 15:08:21

标签: razor umbraco umbraco7

我有以下代码,它显示列出的文本和底部的分页都很好。但是当我尝试将子页面中的图像放入列表时,它对我来说是错误的。有什么想法吗?

@inherits Umbraco.Web.Mvc.UmbracoTemplatePage
@{
    Layout = "SiteLayout.cshtml";
}

<div role="main" id="main">


    <div id="blogPageFeatures">
        <!-- loop through all of the child pages (blog posts) and grab data to output as a summary -->
        @{
        var pageSize =3;
        var page =1;int.TryParse(Request.QueryString["page"],out page);
        var items =Model.Content.Children().Where(x => x.IsDocumentType("BlogArticle")).OrderByDescending(x => x.CreateDate);
        var totalPages =(int)Math.Ceiling((double)items.Count()/(double)pageSize);

        if(page > totalPages)
        {
                page = totalPages;
        }
        else if(page <1)
        {
                page =1;
        }
        }




        @foreach(var item in items.Skip((page -1)* pageSize).Take(pageSize))
        {


                        <a href="@item.Url">

                                <!-- The next image line is where it errors -->
                                <img src="@Umbraco.Media(item.Children.blogArticleImage).Url">

                                    <h2>@item.Name</h2>
                                    <p class="blogTileDate">@item.CreateDate.ToString("dd/MM/yy")</p>





                            </a>

        }


<div class="clearfix"></div>


        <!-- Pagination START -->
        @if(totalPages >1)
        {
        <div class="pagination">
                        <ul>
                                @if(page >1)
                                {
                                        <li><a href="?page=@(page-1)">Prev</a></li>
                                }
                                @for(int p =1; p < totalPages +1; p++)
                                {
                                        var active =(p == page)?" class=\"active\"":string.Empty;
                                        <li@(Html.Raw(active))>
                                                <a href="?page=@p">@p</a>
                                        </li>
                                }
                                @if(page <totalPages)
                                {
                                        <li><a href="?page=@(page+1)">Next</a></li>
                                }
                        </ul>
                </div>
                            }
        <!-- Pagination END -->





        <div class="clearfix"></div>
    </div>
    <div class="clearfix"></div>
</div>

1 个答案:

答案 0 :(得分:4)

您正在获取Model.Content.Children,它是一个强类型的IPublishedContent对象集合。然后你调用item.Children.blogArticlImage,这不会起作用,因为你试图在项目的子项上获取属性,而不是项目本身的属性。您还尝试使用动态语法,这种方法不适用于强类型对象。尝试将图片代码更改为:

<img src="@Umbraco.TypedMedia(item.GetPropertyValue<int>("blogArticleImage")).Url">

这应该是技巧,有一点需要注意的是,如果某个项目没有图像集,或者已经删除了已经选择的图像,则会抛出错误。更强大的方法是这样的:

var imageSrc = "ADD DEFAULT IMAGE PATH HERE";
var media = Umbraco.TypedMedia(item.GetPropertyValue<int>("blogArticleImage"));
if (media != null && !string.IsNullOrEmpty(media.Url))
{
    imageSrc = media.Url;
}
<mig src="@imageSrc">