Library.GetMediaById Umbraco 返回奇怪的字符串

Library.GetMediaById Umbraco Returning Weird String

我正在尝试通过宏在我的 Umbraco 上的轮播中显示图像,我正在使用 Library.GetMediaById(child.picture)。这是我的代码:

        @foreach (var child in slider.Children.Where("Visible"))
        {
            var background = Library.MediaById(child.picture);

            if (i == 0)
            {
                <div id="@i" class="item active" data-id="@i" style="background-image: url(@background.UmbracoFile)">

                </div>
            }
            else
            {
                <div id="@i" class="item" data-id="@i" style="background-image: url(@background.UmbracoFile)">

                </div>
            }

        i++;
        }

然而,当我这样做而不是像我应该的那样得到 <div id="1" class="item" data-id="1" style="background-image: url('/media/1007/slide-2.png')"></div> 时,我得到了一堆额外的东西:

<div id="1" class="item" data-id="1" style="background-image: url({src: '/media/1007/slide-2.png', crops: []})"></div>

我如何才能只获得那个媒体项目 url 而不是所有额外的东西?

顺便说一句,我正在使用 Umbraco 7.4

所以我解决这个问题的方法是,制作一个部分而不是宏,因为部分继承 Umbraco.Web.Mvc.UmbracoTemplatePage 所以我可以使用 Umbraco.Media() 代替。这是工作代码,以防有人遇到此问题并需要帮助:

@inherits Umbraco.Web.Mvc.UmbracoTemplatePage

@{

 var root = Model.Content.AncestorOrSelf(1);

 int i = 0;
}


<div class="container">
  <div id="photo-carousel" class="carousel slide">
    <div class="carousel-inner">
        @foreach (var child in root.Children().Where("naviHide == true"))
        {
            if (child.DocumentTypeAlias.Equals("slider"))
            {
                foreach (var picture in child.Children.Where("naviHide != true"))
                {
                    var background = Umbraco.Media(picture.GetPropertyValue("picture"));

                    if (i == 0)
                    {
                        <div id="@i" class="item active" data-id="@i" style="background-image: url('@background.Url')">

                        </div>
                    }
                    else
                    {
                        <div id="@i" class="item" data-id="@i" style="background-image: url('@background.Url')">

                        </div>
                    }
                    i++;
                }
            }

        }
    </div>

    <a class="carousel-control left" href="#photo-carousel" data-slide="prev">
        <span class="glyphicon glyphicon-chevron-left"></span>
    </a>
    <a class="carousel-control right" href="#photo-carousel" data-slide="next">
        <span class="glyphicon glyphicon-chevron-right"></span>
    </a>
   </div>
  </div>

如果您使用的是 Umbraco 7 或更高版本,我强烈建议使用新的 APIs 来检索 属性 值和内容或媒体节点,而不是使用 Library.MediaById 方法现在已经过时了。

如果您更喜欢动态视图模型,可以使用 DynamicPublishedContent API,它允许您使用 @CurrentPage 模型编写动态查询。所以你的例子是:

@foreach (var child in CurrentPage.AncestorOrSelf(1).Children.Where("isVisible"))
{
    var backgroundPicture = Umbraco.Media(child.Picture); //assuming an image property on child
     var backgroundPictureUrl = picture.Url;
     // your markup here
}

如果您更喜欢强类型模型,则可以使用 IPublishedContent API。请记住,您的视图必须继承自合适的类型,例如 Umbraco.Web.Mvc.UmbracoTemplatePage.

@foreach (var child in Model.AncestorOrSelf(1).Children().Where(c => c.IsVisible))
{
     var backgroundPicture = Umbraco.TypedMedia(child.GetPropertyValue<int>("picture");
     var backgroupdPictureUrl = backgroundPicture.Url;
     // your markup here
}

此外,根据您的示例,我怀疑您可能正在使用图像裁剪器 属性 来存储背景图像,在这种情况下 属性 将具有 json (JObject) 值而不是与媒体 Id 对应的 int。

在这种情况下,检索图片的代码 属性 需要进行调整,请查看 documentation for image cropper 以了解获取图片 url 的不同方式关于您是否已将作物 and/or 指定为焦点。例如,如果您使用动态 API 并且您只对图像 URL 感兴趣,请使用以下内容:

<div style="background-image: url('@child.picture.src')">