C# 将ListView与包含UserControls的DataTemplates绑定到MVVM中的ViewModels

我是MVVM的新手，所以请容忍我

我正在开发一个包含联系人列表的应用程序。我已使用以下模型定义了联系人用户控件：

public class Client
{
    public string FirstName { get; set; }
    public string MiddleName { get; set; }
    public string LastName { get; set; }
    public string PhoneNumber { get; set; }
    public string Address1 { get; set; }
    public string Address2 { get; set; }
    public string City { get; set; }
    public string State { get; set; }
    public string ZipCode { get; set; }
    public int CustomerID { get; set; }

    public string FullName
    {
        get
        {
            string result = FirstName;

            if (string.IsNullOrEmpty(result))
                result = MiddleName;
            else if(!string.IsNullOrEmpty(MiddleName))
                result += string.Format(" {0}", MiddleName);

            if (string.IsNullOrEmpty(result))
                result = LastName;
            else if (!string.IsNullOrEmpty(LastName))
                result += string.Format(" {0}", LastName);

            if (string.IsNullOrEmpty(result))
                result = "";

            return result;
        }
    }
}

以及以下ViewModel：

public class ClientViewModel : ObservableObject
{
    public Client Customer
    {
        get
        {
            return _customer;
        }
        set
        {
            _customer = value;
            RaisePropertyChangedEvent("Customer");
        }
    }
    public string FullName { get { return _customer.FullName; } }
    public string PhoneNumber { get { return _customer.PhoneNumber; } }
    public string Address1 { get { return _customer.Address1; } }
    public string Address2 { get { return _customer.Address2; } }
    public string City { get { return _customer.City; } }
    public string State { get { return _customer.State; } }
    public string ZipCode { get { return _customer.ZipCode; } }

    Client _customer = new Client();
}

以及以下观点：

<UserControl x:Class="LawnCareManager.Views.ClientView"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:local="clr-namespace:LawnCareManager.ViewModels"
             mc:Ignorable="d" 
             d:DesignHeight="180" d:DesignWidth="300">
    <UserControl.DataContext>
        <local:ClientViewModel/>
    </UserControl.DataContext>
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto"/>
            <ColumnDefinition Width="1*"/>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="1*"/>
            <RowDefinition Height="1*"/>
            <RowDefinition Height="1*"/>
            <RowDefinition Height="1*"/>
            <RowDefinition Height="1*"/>
            <RowDefinition Height="1*"/>
            <RowDefinition Height="1*"/>
        </Grid.RowDefinitions>
        <Label Grid.Row="0"
               Grid.Column="0"
               VerticalAlignment="Center"
               HorizontalAlignment="Right"
               Margin="10,0,0,0"
               Content="Name: "/>

        <Label Grid.Row="0"
               Grid.Column="1"
               VerticalAlignment="Center"
               HorizontalAlignment="Left"
               Margin="10,0,0,0"
               Content="{Binding FullName}"/>

        <Label Grid.Row="1"
               Grid.Column="0"
               VerticalAlignment="Center"
               HorizontalAlignment="Right"
               Margin="10,0,0,0"
               Content="Phone Number: "/>

        <Label Grid.Row="1"
               Grid.Column="1"
               VerticalAlignment="Center"
               HorizontalAlignment="Left"
               Margin="10,0,0,0"
               Content="{Binding PhoneNumber}"/>

        <Label Grid.Row="2"
               Grid.Column="0"
               VerticalAlignment="Center"
               HorizontalAlignment="Right"
               Margin="10,0,0,0"
               Content="Address 1: "/>

        <Label Grid.Row="2"
               Grid.Column="1"
               VerticalAlignment="Center"
               HorizontalAlignment="Left"
               Margin="10,0,0,0"
               Content="{Binding Address1}"/>

        <Label Grid.Row="3"
               Grid.Column="0"
               VerticalAlignment="Center"
               HorizontalAlignment="Right"
               Margin="10,0,0,0"
               Content="Address 2: "/>

        <Label Grid.Row="3"
               Grid.Column="1"
               VerticalAlignment="Center"
               HorizontalAlignment="Left"
               Margin="10,0,0,0"
               Content="{Binding Address2}"/>

        <Label Grid.Row="4"
               Grid.Column="0"
               VerticalAlignment="Center"
               HorizontalAlignment="Right"
               Margin="10,0,0,0"
               Content="City: "/>

        <Label Grid.Row="4"
               Grid.Column="1"
               VerticalAlignment="Center"
               HorizontalAlignment="Left"
               Margin="10,0,0,0"
               Content="{Binding City}"/>

        <Label Grid.Row="5"
               Grid.Column="0"
               VerticalAlignment="Center"
               HorizontalAlignment="Right"
               Margin="10,0,0,0"
               Content="State: "/>

        <Label Grid.Row="5"
               Grid.Column="1"
               VerticalAlignment="Center"
               HorizontalAlignment="Left"
               Margin="10,0,0,0"
               Content="{Binding State}"/>

        <Label Grid.Row="6"
               Grid.Column="0"
               VerticalAlignment="Center"
               HorizontalAlignment="Right"
               Margin="10,0,0,0"
               Content="Zip Code: "/>

        <Label Grid.Row="6"
               Grid.Column="1"
               VerticalAlignment="Center"
               HorizontalAlignment="Left"
               Margin="10,0,0,0"
               Content="{Binding ZipCode}"/>
    </Grid>
</UserControl>

现在，我想创建一个用户控件，其中包含以下ViewModel中定义的联系人列表：

public class ClientsListViewModel : ObservableObject
{
    public ObservableCollection<ClientViewModel> Clients
    {
        get { return _clients; }
        set { _clients = value; }
    }

    ObservableCollection<ClientViewModel> _clients = new ObservableCollection<ClientViewModel>();

    public ClientsListViewModel()
    {
        ClientViewModel client = new ClientViewModel();
        client.Customer.FirstName = "John";
        client.Customer.LastName = "Doe";
        client.Customer.PhoneNumber = "555-555-5555";
        client.Customer.Address1 = "1234 Fake Street";
        client.Customer.City = "Springfield";
        _clients.Add(client);
    }
}

public类ClientsListViewModel:observeObject
{
公共可观测收集客户端
{
获取{return\u clients；}
设置{u clients=value；}
}
ObservableCollection_clients=新的ObservableCollection（）；
公共客户端ListViewModel（）
{
ClientViewModel客户端=新的ClientViewModel（）；
client.Customer.FirstName=“John”；
client.Customer.LastName=“Doe”；
client.Customer.PhoneNumber=“555-555-5555”；
client.Customer.Address1=“1234假街”；
client.Customer.City=“Springfield”；
_客户。添加（客户）；
}
}

以及以下视图：

<UserControl x:Class="LawnCareManager.Views.ClientsListView"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:local="clr-namespace:LawnCareManager.ViewModels"
             xmlns:views="clr-namespace:LawnCareManager.Views"
             mc:Ignorable="d" 
             d:DesignHeight="300" d:DesignWidth="300">
    <UserControl.DataContext>
        <local:ClientsListViewModel/>
    </UserControl.DataContext>
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="1*"/>
        </Grid.RowDefinitions>

        <Label Content="Contacts"
               Grid.Row="0"
               Grid.Column="0"/>
        <ListView Grid.Column="1" Grid.Row="2" Grid.ColumnSpan="2" ItemsSource="{Binding Clients}" x:Name="listView">
            <ListView.ItemTemplate>
                <DataTemplate>
                    <views:ClientView DataContext="{Binding}"/>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
    </Grid>
</UserControl>

问题在于ClientsListView中的ClientView ListViewItems未正确绑定到ClientViewModels的ObservableCollection。如果我添加更多的ClientViewModels，列表中会显示正确数量的ClientView，但ClientView中没有任何标签正在填充

---

谁能告诉我我做错了什么？非常感谢您的反馈

这里的问题是，您正在InitializeComponent方法中为客户端视图构建数据上下文。这是由于Xaml中的静态声明造成的。您可以通过将这一行代码添加到ClientView构造函数来从经验上证明这一点

    var dc = this.DataContext;

并注意它是在“错误的时间”用空值创建的

如果在ClientView.xaml中更改这些行

<UserControl.DataContext>
    <genericMvvm1:ClientViewModel/>
</UserControl.DataContext>

对此

   <!--<UserControl.DataContext>
        <genericMvvm1:ClientViewModel/>
    </UserControl.DataContext>-->

---

您将看到您的客户机以您期望的方式填充和显示。您需要更改设计策略，以考虑InitializeComponent的行为方式，但这个答案会让您“不顺利”。

您需要给我们一些线索，让我们知道是什么让您认为它错了。到目前为止，你写的东西没有明显的问题。对不起，加里。我编辑了帖子以添加我的问题。我现在可以看到问题了。讨厌的虫子。用于为客户机视图指定数据上下文的Xaml将创建具有空客户机的视图。您需要在客户端视图xaml中更改数据上下文的声明。ClientView的DataContext声明需要是什么样的？我需要将DataContext声明移动到ClientViewModel吗？谢谢！在我做了改变后，一切如期进行。