自定义数据类型在 umbraco 中作为 Json 对象返回答案

【问题标题】：Custom Data Type returning as an Json Object in umbraco自定义数据类型在 umbraco 中作为 Json 对象返回
【发布时间】：2017-07-14 07:14:07
【问题描述】：

我正在尝试创建一个轮播作为数据类型，为此，我正在尝试从开发人员选项卡中创建这样的自定义数据类型

在内容部分会这样显示

所以我在这样的模板中调用这个新的数据类型

但我在浏览器中获取了像这样的整个对象

回复是这样的

知道如何在模板中调用它来显示带有文本和图像的轮播。

目前这是返回 @Umbraco.Field("car")

请给整个对象任何建议，我需要显示为轮播:)

【问题讨论】：

我不是该领域的专家，无法为您的问题提供解决方案，但我可以说这不是在这里提问的正确方式。您必须更具体地说明问题而不是历史/故事，并显示代码而不是屏幕截图
如果你知道 umbraco，你会明白，如果不是很难解释 :) @un-lucky

标签： c# angularjs razor umbraco umbraco7

【解决方案1】：

就 Umbraco 而言，它为您提供了属性中包含的原始值，您需要解析原始值，或者我推荐的方法是实现您自己的 PropertyValueConvertor

属性值转换器将属性编辑器数据库存储的值转换为另一种类型。可以从 MVC Razor 或任何其他已发布内容 API 访问转换后的值。

要实现这一点，您需要实现IPropertyValueConverter 接口。

周围有很多示例来演示如何自行实现。这是取自 Umbraco Core 的一个简单但相关的 example：

using System;
using Newtonsoft.Json;
using Newtonsoft.Json.Linq;
using Umbraco.Core.Logging;
using Umbraco.Core.Models.PublishedContent;

namespace Umbraco.Core.PropertyEditors.ValueConverters
{
    /// <summary>
    /// The default converter for all property editors that expose a JSON value type
    /// </summary>
    /// <remarks>
    /// Since this is a default (umbraco) converter it will be ignored if another converter found conflicts with this one.
    /// </remarks>
    [DefaultPropertyValueConverter]
    [PropertyValueType(typeof(JToken))]
    [PropertyValueCache(PropertyCacheValue.All, PropertyCacheLevel.Content)]
    public class JsonValueConverter : PropertyValueConverterBase
    {
        /// <summary>
        /// It is a converter for any value type that is "JSON"
        /// </summary>
        /// <param name="propertyType"></param>
        /// <returns></returns>
        public override bool IsConverter(PublishedPropertyType propertyType)
        {
            var propertyEditor = PropertyEditorResolver.Current.GetByAlias(propertyType.PropertyEditorAlias);
            if (propertyEditor == null) return false;
            return propertyEditor.ValueEditor.ValueType.InvariantEquals(PropertyEditorValueTypes.Json);
        }

        public override object ConvertDataToSource(PublishedPropertyType propertyType, object source, bool preview)
        {
            if (source == null) return null;
            var sourceString = source.ToString();

            if (sourceString.DetectIsJson())
            {
                try
                {
                    var obj = JsonConvert.DeserializeObject(sourceString);
                    return obj;
                }
                catch (Exception ex)
                {
                    LogHelper.Error<JsonValueConverter>("Could not parse the string " + sourceString + " to a json object", ex);                    
                }
            }

            //it's not json, just return the string
            return sourceString;
        }

        //TODO: Now to convert that to XPath!
    }
}

【讨论】：

【解决方案2】：

您可以尝试编写一些 HTML 和 Razor 以获得一些结果。您需要为以下内容安装 Bootstrap：

<section class="carousel-wrapper">
    <div id="myCarousel" class="carousel slide" data-ride="carousel">
        <div class="carousel-inner" role="listbox">
            @foreach (var slide in CurrentPage.Car)
            {
               if (string.IsNullOrWhiteSpace(slide))
               {
                  continue;
               }

                <div class="item @(slide == CurrentPage.Car[0] ? "active" : string.Empty)">
                    <div class="fullwidth-block full-screen">
                        <img src="@Umbraco.Media(slide.img).Url" class="fill">

                        <div>
                           @slide.desc
                       </div>
                    </div>
                </div>
            }
        </div>
    </div>
</section>

这适用于 Umbraco 7.5.13。您可能需要进行一些调试才能使其在您的场景中正常工作。但是从你的截图来看，你只使用后台吗？不是 Visual Studio 等。

【讨论】：