Javascript 角度2-剑道UI下拉列表默认值

我正在尝试使用剑道UI创建一个下拉列表，除了在屏幕加载时选择一个默认的值之外，它工作得很好

根据他们的要求，我的代码应该如下所示：

HTML:

<kendo-dropdownlist formControlName="description"
                    [data]="definitionData.Languages"
                    [(ngModel)]="languageValue"
                    [textField]="'Value'"
                    [valueField]="'Key'"
                    [value]="2"
                    [valuePrimitive]="true">
</kendo-dropdownlist>
<span class="left col-xs-6">
    <input type="text" id="descriptionField" class="form-control" [value]="getValue(descriptionForm.controls.description.value)" #descriptionField (blur)="updateDescriptionValue(descriptionField.value, languageValue)" />
</span>

public descriptionForm: FormGroup = new FormGroup({
    description: new FormControl()
});

我的下拉列表可以工作，但当我加载页面时，默认选择的值为空，它应该是带有

Key:2

注意：我不想使用

[defaultItem]

，因为它只会复制项目，这意味着它将在下拉列表中出现2次

我尝试过很多事情，但我不知道我应该做什么

---

提前感谢

您应该在

value

和

ngModel

绑定之间进行选择。发件人：

DropDownList不支持同时使用

value

属性和

ngModel

值绑定

具有

值的解决方案

属性：

<kendo-dropdownlist formControlName="description"
                    [data]="definitionData.Languages"
                    [(ngModel)]="languageValue"
                    [textField]="'Value'"
                    [valueField]="'Key'"
                    [value]="2"
                    [valuePrimitive]="true">
</kendo-dropdownlist>
<span class="left col-xs-6">
    <input type="text" id="descriptionField" class="form-control" [value]="getValue(descriptionForm.controls.description.value)" #descriptionField (blur)="updateDescriptionValue(descriptionField.value, languageValue)" />
</span>

public descriptionForm: FormGroup = new FormGroup({
    description: new FormControl()
});

从HTML中删除

ngModel

绑定到

valueChange

事件并在模型中设置值

HTML:

具有

ngModel

属性的解决方案：

<kendo-dropdownlist formControlName="description"
                    [data]="definitionData.Languages"
                    [(ngModel)]="languageValue"
                    [textField]="'Value'"
                    [valueField]="'Key'"
                    [value]="2"
                    [valuePrimitive]="true">
</kendo-dropdownlist>
<span class="left col-xs-6">
    <input type="text" id="descriptionField" class="form-control" [value]="getValue(descriptionForm.controls.description.value)" #descriptionField (blur)="updateDescriptionValue(descriptionField.value, languageValue)" />
</span>

public descriptionForm: FormGroup = new FormGroup({
    description: new FormControl()
});

从HTML中删除

value

在模型中设置默认值

HTML:

---

为什么同时使用

ngModel

和

value

？确保

value

是

data

@KonradKahl的元素，因为我的表单需要是反应式的，并且根据文档，他们使用

value

来设置默认选择的值（我希望它是

Key=2

的项，它恰好也是数组中的第二项）