如何在我的 Umbraco 页面上显示来自 属性 的图片?

How do I display a picture from a property on my Umbraco Page?

我在 Umbraco 上有一组页面,上面有 MediaPickers,这些图片将作为链接显示在索引页面上,以便客户在单击它们时可以转到其产品的特定页面。

我已经设法加载了链接,但是使用下面的代码我无法显示适当的图片,因为下面的代码抛出了空引用异常

`var media=Umbraco.TypedMedia(subitem.Properties.Where(x=>x.PropertyTypeAlias=="picture")).SingleOrDefault().Url;`

有人可以帮忙吗?完整代码如下

 @inherits Umbraco.Web.Mvc.UmbracoTemplatePage

@{

    Layout = "_SiteMaster.cshtml";



    var nodes = umbraco.uQuery.GetNodesByType("productType");

    var ProdPage = Umbraco.TypedContent(1087);




}

<header>
    <div class = "container-fluid">
        <div class="row">
              <div class="col-md-12">
                  <h1 class="text-center">Please Select your Product</h1>
                  </div>
            </div>
            <br />            
             <div class="row">

            <div class="col-md-3">  
                </div>

                 @*<img src="@Umbraco.Media(item.Id)" class="img-responsive" alt="college">*@

                @foreach (var subitem in ProdPage.Children)
                {
                    var media = Umbraco.TypedMedia(subitem.Properties.Where(x=>x.PropertyTypeAlias=="picture")).SingleOrDefault().Url;

                    <div class="col-md-3">
                    <a href="@Umbraco.NiceUrl(1087)?PageID=@subitem.Name"><img src=@media alt="Image" /></a>
                    </div>
                }


                    @*<a href=@SearchURL?PageID=College><img src="/media/1001/college.png" class="img-responsive" alt="college"></a>
                        </div>
                         <div class="col-md-3">
                          <a href=@SearchURL?PageID=Core><img src="/media/1002/Core.png" class="img-responsive" alt="core"> </a>
                        </div>
                         <div class="col-md-3">
                         <a href=@SearchURL?PageID=Salon><img src="/media/1003/Salon.png" class="img-responsive" alt="salon"> </a>*@
                </div>
            </div>
         </div>
    </header>

你看过这个解决方案吗?据我所知,以下解决方案应该有效。 Display Image from Media Library in Umbraco 7

而且我刚刚查看了我的一个 Umbraco 项目,下面是我如何获得 Umbraco 图像 - 请注意这是 Umbraco 网络表单,它是背后的代码;

 var footer = Umbraco.TypedContent(NodeHelper.Settings.Footer).AsStronglyTyped<DocumentTypes.Repository.Footer>();

 if (footer.PoweredByImageId.HasValue)
                {
                    this.imgPoweredBy.ImageUrl = MediaHelper.GetMediaUrlById(footer.PoweredByImageId.Value);
                    if (footer.PoweredByLink != null)
                    {
                        this.hplPoweredBy.NavigateUrl = footer.PoweredByLink.Url;
                    }
                }

以及您需要的 MediaHelper,希望对您有所帮助;

/// <summary>
    /// Provides utility methods for manipulations with media files.
    /// </summary>
    public static class MediaHelper
    {
        /// <summary>
        /// Gets the media URL by id.
        /// </summary>
        /// <param name="mediaId">The media id.</param>
        /// <returns>Returns image url.</returns>
        public static string GetMediaUrlById(int mediaId)
        {
            string retVal = String.Empty;
            try
            {
                XPathNodeIterator xpathNodeIterator = umbraco.library.GetMedia(mediaId, false);
                if (xpathNodeIterator != null && mediaId != 0)
                {
                    xpathNodeIterator.MoveNext();
                    var selectSingleNode = xpathNodeIterator.Current.SelectSingleNode("umbracoFile");
                    if (selectSingleNode != null)
                        retVal = selectSingleNode.Value;
                }
            }
            catch
            {
            }

            return retVal;
        }

// Some more methods..

}