Kendo UI ComboBox for Angular：如何防止 Expected value of type Object 错误？

Question

我正在尝试为 Angular 创建一个 Kendo ComboBox 不会因错误“阻止对象类型的预期值”而崩溃：

<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" - 我用它来允许控件接收不在列表中的初始值。在我的应用程序中，我使用带有空初始列表的服务器端过滤

在应用程序中使用时（服务器端过滤）我在按下箭头按钮时也收到此错误，但我可以通过确保初始值在值列表中（丑陋）或只需移除按钮即可。

知道如何进行这项工作吗？

Answer 1

根据 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 如果有帮助请告诉我。

Answer 2

valueNormalizer 对我根本不起作用。

我寻求不同的解决方案（由于我公司的安全限制，我不能 post 此处的代码）。

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

我只是将初始值推送到 [data] 数组并修复了它。不需要 [allowCustome]="true"

Kendo UI ComboBox for Angular：如何防止 Expected value of type Object 错误？

Kendo UI ComboBox for Angular: how to prevent Expected value of type Object error?

kendo-ui

kendo-combobox

kendo-ui-angular2