Question

我正在尝试渲染媒体图片列表。

在我看来，我有：

查看

@section pageSpecificJsBody {
    <script src="/scripts/casestudieslist.js"></script>

    <script>
        $(function () { pdms.caseStudiesList.init(); });
    </script>
}

用于调用js文件

js文件调用以下控制器

控制器

[HttpGet]
public JsonResult List()
{
    var CaseStudyContentTypeId = Services.ContentTypeService.GetContentType("CaseStudy").Id;

    var CaseStudies = Services.ContentService.GetContentOfContentType(CaseStudyContentTypeId).Select(x => new CaseStudy { 
        BannerImage = Umbraco.Content(x.Id).GetPropertyValue("bannerimage"),              
        Url = Umbraco.Content(x.Id).Url.ToString(),
        SectorName = Umbraco.Content(x.GetValue("selectSector")).Name,   //x.GetValue("selectSector").ToString(),
        BodyTextHeading = x.GetValue("bodyTextHeading").ToString(),
        BannerHeading = x.GetValue("bannerheading").ToString() 
});

模型

public class CaseStudy
{
    public string SectorName { get; set; }
    //public int Id { get; set; }
    public string Url { get; set; }
    public string BannerHeading { get; set; }
    public string BannerImage { get; set; }
    public string BodyTextHeading { get; set; }
}

以前Banner Image使用的是媒体选择器，因此可以通过Umbraco.Content访问图像，但我现在已将它们全部设置为使用自定义裁剪器将其设置为媒体类型

我的问题是......我现在如何设置BannerImage属性以获取相关的媒体图像？

通常我可以在视图中做类似的事情。

var BannerImage = Model.Content.GetPropertyValue("bannerimage");

var MediaImage = Umbraco.TypedMedia((int)BannerImage);

<source srcset="@MediaImage.GetCropUrl("desktopMax")" />

但是因为我在控制器中，我无法访问该模型，而且我真的陷入困境，对Umbraco来说还是新手，并且还没有完全理解所有内容，所以如果事情不清楚就很抱歉。

提前致谢

Answer 1

你可以通过以下方式在很多地方（包括控制器）获得@Umbraco助手：

UmbracoHelper umbracoHelper = new UmbracoHelper(UmbracoContext.Current);

我可能会将您的代码重写为：

var caseStudies = from caseStudy in Services.ContentService.GetContentOfContentType(CaseStudyContentTypeId)
      let content = umbracoHelper.TypedContent(caseStudy.Id)
      let bannerImage = umbracoHelper.TypedMedia(caseStudy.GetPropertyValue("bannerimage"))
      let sector = umbracoHelper.TypedContent("selectSector")
      select new CaseStudy {
        BannerImage = bannerImage.Url,
        Url = content.Url,
        SectorName = sector.Name,
        BannerHeading = caseStudy.GetPropertyValue<string>("bannerheading"),
        BodyTextHeading = caseStudy.GetPropertyValue<string>("bodyTextHeading"
      };

Answer 2

我发现了这篇帖子Here，其中有一个很好的建议就是获取图像的裁剪网址。

以下是我为解决问题所写的内容：

控制器

   var CaseStudyContentTypeId = Services.ContentTypeService.GetContentType("CaseStudy").Id;

            var CaseStudies = Services.ContentService.GetContentOfContentType(CaseStudyContentTypeId).Select(x => new CaseStudy
            {
                BannerImage = Umbraco.TypedMedia(x.GetValue<int>("bannerimage")).GetCropUrl("umbracoFile", "mobile"),
                Url = Umbraco.Content(x.Id).Url.ToString(),
                SectorName = Umbraco.Content(x.GetValue("selectSector")).Name,   //x.GetValue("selectSector").ToString(),
                BodyTextHeading = x.GetValue("bodyTextHeading").ToString(),
                BannerHeading = x.GetValue("bannerheading").ToString()
            });

我要调试并测试Sams方法，这样我就可以解决两个例子之间的区别。如果有人（或Sam）可以提供关于为什么他们认为某种方式可能比其他方式更有益的建议，那么请你给出解释。

提前致谢。

Umbraco 7渲染媒体类型图像

2 个答案: