Kendo UI ComboBox for Angular：如何防止类型为Object的期望值错误？

问题描述

我正在尝试使Angular的Kendo ComboBox不会由于错误“防止类型为Object的期望值”而崩溃：

<kendo-comboBox
    formControlName="gender"
    [data]="genders"
    [textField]="'text'"
    [valueField]="'value'"
    [valuePrimitive]="false"
    [filterable]="true"
    [allowCustom]="true"
    required
>
</kendo-comboBox>

StackBlitz

如果删除该值并按下Tab（组合模糊），则可以获得错误。实际上，通过在框中保留无效值，就会发生此错误。

我将在下面解释为什么使用某些设置：

• textField和valueField-在我的应用程序中，我请求复杂的对象，选择的值将为其他表单字段提供一些信息
• [valuePrimitive]="false"-所选值是一个复杂的对象
• [allowCustom]="false"-我使用它来允许控件接收不在列表中的初始值。在我的应用程序中，我正在使用服务器端过滤且初始列表为空

在应用程序中使用（服务器端过滤）时，按箭头按钮时也会收到此错误，但是可以通过确保初始值在值列表内（丑陋）或简单地通过以下操作来摆脱此错误删除按钮。

关于如何进行这项工作的任何想法吗？

解决方法

根据Kendo UI for Angular，您必须使用valueNormalizer函数将用户实际键入的内容转换为有效对象。

public valueNormalizer = (text: Observable<string>) => text.pipe(map((text: string) => {
    return {
        value: this.genders[this.genders.length - 1].value + 1,//whatever value
        text: text
    };
}));

请检查更新后的Stackblitz，并告诉我它是否有帮助。

,

valueNormalizer根本不适合我。

我寻求了不同的解决方案（由于公司的安全性限制，我无法在此处发布代码）。

我们要允许一个初始值，而必须允许[allowCustomer]="true"，因为该初始值最初不是从服务器中获取的[data]数组的一部分。

我只是将初始值推送到[data]数组，然后对其进行了修复。无需[allowCustome]="true"