Umbraco 7 渲染媒体类型图像

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; }
}

以前横幅图像使用媒体选择器，因此可以通过 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，它对获取图像的裁剪 url 有很好的建议。

这是我为解决问题而写的：

控制器

   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）可以就他们为什么认为一种方法可能比另一种方法更有益提供建议，请您给出解释。

提前致谢。