Kendo UI多选下拉菜单预填充指定值无法正常展示问题咨询

安全阿岳

2026-9-24

Kendo UI多选下拉菜单预填充值失效问题解决方法

导致该问题的核心原因有3个：

HTML代码中存在多处中文引号语法错误，导致组件属性解析异常
开启了k-option-autobind="false"后，数据源未提前加载完成就赋值了选中项，组件无法匹配到对应数据源条目
ng-model绑定的vm.country初始值类型不符合多选组件要求，未声明为数组格式

分步修复方案

第一步：替换所有中文半角引号为英文半角引号，修正后的组件代码如下：

<select
    class="countryName"
    kendo-multi-select
    k-option-autobind="false"
    k-data-text-field="'countryCode'"
    k-data-value-field="'countryCode'"
    k-data-source="vm.countryData"
    ng-model="vm.country"
    k-filter="'contains'">
</select>

第二步：确认控制器中vm.country初始值为数组类型，初始化代码参考：

// 控制器初始化阶段直接赋值，需保证数据源已加载完成
vm.country = ['IN', 'EU'];

第三步：适配k-option-autobind="false"的配置逻辑
如果要保留autobind关闭的配置，需要在vm.countryData数据源异步加载完成的回调中再给vm.country赋值；如果无特殊要求，直接把k-option-autobind改为true，组件初始化时会自动加载数据源并匹配预选中值。