Umbraco Archetype 渲染图像 (MediaPicker 2)

Question

我正在使用 Umbraco 中的 Archtype 构建图像滑块。

当我开始使用 umbraco 7.5.9 和 Umbraco.MediaPicker 时，我使用 Umbraco.MediaPicker2 的最新版本 Umbraco (7.6.2) 开始了一个新项目

使用旧的 MediaPicker 渲染图像没有问题，但使用 MediaPicker2 似乎不可能。

这是我的设置。

原型： 这是呈现旧 MediaPicker 的局部视图

<div class="fullWidthSlider">
    @foreach (var image in @CurrentPage.SliderImages)
    {
        <div>Id: @image.GetValue("image")</div>@*Line added for debug*@
        var media = @Umbraco.Media(image.GetValue("image"));
        <img src="@media.Url" />
    }
</div>

这曾经适用于旧的媒体选择器和 @image.GetValue 返回的 int id。但是使用新的 MediaPicker2 它会返回 Umbraco.Core.Udi[]

如果我用下面的代码遍历 archtype 的属性，我会得到这个结果（见下面的代码）

@foreach (var fieldset in Model.Content.GetPropertyValue<ArchetypeModel>("sliderImages"))
{
    foreach(var prop in fieldset.Properties){

        <p>@prop.Alias - @prop.Value</p>

    }
}

href -

altText - 替代测试

图像 - umb://media/c33bfe07a82b4df18a79db154139cb91

href -

altText - Fjall

图片 - umb://media/40d5778d34bb4035b5146c901de75212

谁能告诉我如何从这些数据中渲染图像。

谢谢

Answer 1

我刚刚坐过山车想明白了！

您可以使用以下代码从图像字符串中获取IPublishedContent：

// Your string which is retrieved from Archetype.
var imageString = "umb://media/c33bfe07a82b4df18a79db154139cb91";

// Get the guid from this string.
var imageGuidUdi = GuidUdi.Parse(imageString);

// Get the ID of the node!
var imageNodeId = ApplicationContext.Current.Services.EntityService.GetIdForKey(guidUdi.Guid, (UmbracoObjectTypes)Enum.Parse(typeof(UmbracoObjectTypes), guidUdi.EntityType, true));

// Finally, get the node.
var imageNode = Umbraco.TypedMedia(imageNodeId.Result);

查看我们的 Umbraco 上的 this thread，它涵盖了这个问题。

我使用this comment 找出如何从图像的 guid 中获取 ID。

---

看起来 Umbraco 总部正在推动人们将新的 ModelsBuilder 与打字模型一起使用。我不确定 ModelsBuilder 是否支持 Archetype，这就是为什么会有这么多麻烦。

我个人在我的所有项目中都使用Nested Content，因为它执行相同的功能，但 Umbraco 更好地支持 (IMO)，因为它使用文档类型来存储可重复的内容架构。因此，它可以轻松地映射到 IPublishedContent，因此受到 ModelsBuilder 的支持！