组合框数据绑定

本文解释了向ComboBox组件提供数据的不同方法、与数据绑定相关的属性及其结果。

关于“值绑定”和“数据绑定”的详细介绍，以及两者的区别，请参见值绑定vs数据绑定篇文章。

绑定数据有两种关键方法:

• 原始类型
• 模型

您可能会发现一些注意事项很有用，例如显示占位符当值不在数据源范围内时:

• 注意事项
  • 值超出范围
  • 组件引用
  • 缺少值或数据

原始类型

您可以将ComboBox数据绑定到一个简单的数据集合。当您有一个可供用户选择的具体选项列表时，它们的字符串表示通常适合显示，您不需要特殊的模型。

将组合框绑定到基本类型(如int，字符串，双)，你需要

1. 提供一个IEnumerable < TItem >所需类型的数据财产
2. 设置相应的价值。如果价值是零，它将使用来自数据源的第一项填充。

@*绑定到原始类型的列表(string, int，…)*@   @code{受保护的列表 MyList =新列表(){"第一"，"第二"，"第三"};保护字符串MyItem{获取;设置;} //在组件初始化protected override时定义一个预选值OnInitialized() {MyItem = "second";}}

绑定到模型

您可以将ComboBox绑定到应用程序中的模型。当您有一个有限列表的数字表示(例如，公司中的部门)，并且您希望用户根据友好的文本名称选择它们时，这很有用。

将ComboBox绑定到一个模型:

1. 填充它数据参数，在下拉列表中使用您想要的项目集合。
2. 设置文本框和ValueField参数指向模型的相应属性名。
3. 设置价值属性设置为组件的初始值(可选)。

的文本框和ValueField参数必须指向模型属性，这是原始的类型(int，字符串等)。的价值和ValueField类型必须匹配并且是基本的。

@selectedValue   @code{//在实际情况下，模型通常在单独的文件中//模型类型和值字段类型必须提供给dropdpownlist公共类MyDdlModel{公共int MyValueField {get;设置;}公共字符串MyTextField {get;设置;}} int selectedValue {get;设置;} //在组件初始化受保护的覆盖时定义一个预选值OnInitialized() {selectedValue = 3;} IEnumerable myDdlData = Enumerable。范围(20)。Select(x => new MyDdlModel {MyTextField = "item " + x, MyValueField = x});}

如果您正在从描述下拉项的视图模型中寻找更多字段，而不仅仅是价值，请参阅从下拉菜单中获取模型KB文章及OnChange事件。

您也可以审查/加入讨论并投票支持此请求:将下拉列表值绑定到复杂模型

注意事项

ComboBox组件尝试根据所提供的参数推断其模型和值的类型数据和初始价值。这影响了它的方式得到参考文献发生了什么如果不能提供数据或值。提供一个值，该值不在数据源中需要考虑到应用程序，因为组件不会改变它。

值超出范围

此具体适用于以下情况自定义值输入被禁用(AllowCustom = " false "这是它的默认值)。

当价值类型中存在的任何值都不匹配ValueField的数据集合时，ComboBox组件将不会更改价值或者选择一个新项目。在通常情况下，它将显示为空白，表示没有从其数据中选择任何内容。

如果您设置了占位符和价值匹配默认的类型的值(例如，0对于一个int或零对于一个int ?或字符串)，你会看到占位符。一个价值这是非——默认的不会显示占位符。

处理这样的“意外”值取决于应用程序—例如，通过防御检查，或通过表单验证，或在设置一个新值之前首先检查数据源中存在的内容价值。

当AllowCustom = " true "，用户在输入中输入的内容将被设置为价值组件的，而不考虑数据源。

组件引用

ComboBox是一个通用组件，它的类型来自它绑定的模型和值字段类型。当绑定到基本类型时，引用仅属于该基本类型。

@*绑定到原始值时的引用类型*@   @code{//通用组件的类型由你传递给它的模型的类型和它的值字段telerikblazor . components决定。TelerikComboBox mycombof;protected List MyList = new List() {"first"， "second"， "third"};字符串initialValue {get;设置;} //在组件初始化受保护的覆盖时定义一个预选值OnInitialized() {initialValue = "third";}}

@*绑定到模型集合时的引用*@   @code{//通用组件的类型由你传递给它的模型的类型和它的值字段telerikblazor . components决定。TelerikComboBox mycombref;IEnumerable myComboData = Enumerable。范围(20)。Select(x => new MyDdlModel {MyTextField = "item " + x, MyValueField = x});公共类MyDdlModel{公共int MyValueField {get;设置;}公共字符串MyTextField {get;设置;}}

缺少值或数据

如果你不能提供其中任何一个价值,或数据初始化组件时，您需要将相应的类型属性设置为TItem和TValue属性如下所示。

@*如果没有提供值或数据，如何声明combobox *@   @code{公共类MyDdlModel //TItem匹配模型的类型{公共int MyValueField {get;设置;} //TValue匹配值字段的类型公共字符串MyTextField {get;设置;IEnumerable myComboData = Enumerable。范围(20)。Select(x => new MyDdlModel {MyTextField = "item " + x, MyValueField = x});//如果"myComboData"对象初始值为null，并在某个事件上填充，则采用相同的配置

另请参阅

• 组合框的概述
• 现场演示:ComboBox