显示所选组合框项目显示名称

本文关键字：显示 项目 组合 | 更新日期: 2023-09-27 18:16:11

我有一个包含ValueMember="Id"和DisplayMember="Id"的组合框，希望在选中ComboBox中的某个值后，在标签中显示所选项目属性Name。我用的是某种MVVM pattern。因此，我将SelectedId绑定到Model，并将ItemsSource绑定到ViewModelodel中，使用setters和OnPropertyChanged()很容易，但现在我在模型中有很多字段只用于UI表示(

我已经成功地使用组合框LostFocus事件显示了所选项目的名称，其中我调用ViewModel方法，在该方法中我使用LINQ获得属性Name(来自List，其中l.Id=Model.SelectedId(。

但是，有更简单的方法吗？

显示所选组合框项目显示名称

您可以直接绑定到标签的组合框：

     <ComboBox Name="MyCombo" ItemsSource="{Binding ComboListObjects}" SelectedItem="{Binding ComboSelection}" />
        <Label Content="{Binding ElementName=MyCombo, Path=SelectedValue}"/>

但是，由于您使用的是ViewModel，您可能应该稍微改变一下。组合框上没有SelectedId，所以我认为您的意思是SelectedValue。相反，我建议在ViewModel上创建一个属性来保存SelectedItem。我已经包含了一个样本：

ViewModel:

public class MyViewModel : INotifyPropertyChanged
{
   public List<MyObject> ComboListObjects
    { 
        get{
            return new List<MyObject>();  // <-- fill this
        }
    }
    private MyObject _selectedItem = null;
    public MyObject ComboSelection
    {
        get { return _selectedItem; }
        set {
            _selectedItem = value;
            NotifyPropertyChanged("ComboSelection");
        }
    }
}

视图：

    <ComboBox Name="MyCombo" ItemsSource="{Binding ComboListObjects}" SelectedItem="{Binding ComboSelection}" />
    <Label Content="{Binding ComboSelection.Id}"/>
    <Label Content="{Binding ComboSelection.Name}"/>
    <Label Content="{Binding ComboSelection.OtherInfo}"/>

如果要使用MVVM，请避免使用代码隐藏，尤其是事件，除非您正在编写自定义控件。

希望能有所帮助。。。

以下是如何使用MVVM将组合框绑定到图书列表并在标签上显示图书标题的示例。


在xaml标记中，使用ItemsSource和SelectedItem属性将组合框绑定到视图模型

<ComboBox Name="cbBook" ItemsSource="{Binding Books}"  SelectedItem="{Binding SelectedBook, Mode=TwoWay}" />
<Label DataContext="{Binding SelectedBook}" Content="{Binding Title}" />


在视图中，将DataContext设置为视图模型类

public partial class MyView : UserControl
{
    public MyView()
    {
        InitializeComponent();
        DataContext = new BookViewModel();
    }
}


视图模型应该具有要绑定到的公共属性。

public class BookViewModel : BaseViewModel
{
    public BookViewModel()
    {
       Books = new ObservableCollection<Book>();
    }
    public ObservableCollection<Book> Books { get; set; }
    private Book _selectedBook; 
    public Book SelectedBook 
    { 
       get { return _selectedBook; } 
       set
       {
          _selectedBook = value;
          NotifyPropertyChanged(() => SelectedBook); 
       }
    }
}


这个基类实现了INotifyPropertyChanged接口。我使用lambda表达式来确保类型安全。

public abstract class BaseViewModel : INotifyPropertyChanged
{
    protected void NotifyPropertyChanged<T>(Expression<Func<T>> expression)
    {
        if (PropertyChanged != null)
        {
            PropertyChanged(this, new PropertyChangedEventArgs(((MemberExpression)expression.Body).Member.Name));
        }
    }
    public event PropertyChangedEventHandler PropertyChanged;
}
相关文章：