在 UWP 问题中将 JSON JArray 绑定到 Listview答案

【问题标题】：Binding JSON JArray to Listview in UWP Issue在 UWP 问题中将 JSON JArray 绑定到 Listview
【发布时间】：2017-06-05 19:10:17
【问题描述】：

在 Visual Studio 通用 Windows 应用程序中，我试图将 JArray 绑定到 Listview。它似乎编译得很好，并且行数填充到 Listview 但没有数据填充行。我在这里做错了什么，或者这甚至可能吗？

使用 Newtonsoft.Json.Linq；

XAML

<ListView Grid.Row="0" x:Name="lstJobData">
    <ListView.ItemTemplate>
        <DataTemplate>
            <Grid Margin="8">
                <Grid.RowDefinitions>
                    <RowDefinition Height="*"/>
                    <RowDefinition Height="*"/>
                    <RowDefinition Height="*"/>
                </Grid.RowDefinitions>
                <TextBlock Grid.Row="0" Text="{Binding Path=job_id}" FontSize="14" Foreground="White"/>
                <TextBlock Grid.Row="1" Text="{Binding Path=job_number}" FontSize="14" Foreground="White"/>
                <TextBlock Grid.Row="2" Text="{Binding Path=ship_type}" FontSize="14" Foreground="White"/>        
            </Grid>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

Service层的JArray（从Json字符串转换为Jarray）

{[
  { "job_id": 399783, "job_number": "XYZ-J111111", "ship_type": "c" },
  { "job_id": 445672, "job_number": "XYZ-J222222", "ship_type": "p" },
  { "job_id": 896543, "job_number": "XYZ-J333333", "ship_type": "f" }
]}

XAML（代码隐藏）

private async void Button1_Click(object sender, RoutedEventArgs e)
{
    MyServices.Service1Client client = new MyServices.Service1Client();
    var itemSource = await client.GetDTAsync();
    JArray result = JArray.Parse(itemSource);

    lstJobData.ItemsSource = result;

}

【问题讨论】：

您提供的json不正确
另外，请添加JArray class

标签： c# json listview uwp win-universal-app

【解决方案1】：

当我们将JArray 设置为ListView 的ItemsSource 属性时，我们不能使用XAML 中的路径。 path的意思是Property-path，它会指向item的属性。该项目中也没有job_id 属性。

如果你想在 XAML 中使用路径，我们应该可以创建一个Job 类。而在Job中，我们应该能够定义job_id、job_number和 ship_type 属性。然后我们应该能够将Job 添加到Job 类的ObservableCollection 中。

例如：

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <Button HorizontalAlignment="Right" VerticalAlignment="Top" Click="Button1_Click" >click</Button>
    <ListView VerticalAlignment="Bottom" HorizontalAlignment="Center" Grid.Row="0" x:Name="lstJobData">
        <ListView.ItemTemplate>
            <DataTemplate>
                <Grid Margin="8">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="*" />
                        <RowDefinition Height="*" />
                        <RowDefinition Height="*" />
                    </Grid.RowDefinitions>
                    <TextBlock Grid.Row="0" Text="{Binding Path=job_id}" FontSize="14" Foreground="Red" />
                    <TextBlock Grid.Row="1" Text="{Binding Path=job_number}" FontSize="14" Foreground="Red" />
                    <TextBlock Grid.Row="2" Text="{Binding Path=ship_type}" FontSize="14" Foreground="Red" />
                </Grid>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>
</Grid>

背后的代码：

public sealed partial class MainPage : Page
{
    private ObservableCollection<Job> Jobs;

    public MainPage()
    {
        this.InitializeComponent();
        Jobs = new ObservableCollection<Job>();
    }

    private void Button1_Click(object sender, RoutedEventArgs e)
    {
        string newJson = @"
        [
            {'job_id':399783,'job_number':'XYZ-J111111','ship_type':'c'},
            {'job_id':445672,'job_number':'XYZ-J222222','ship_type':'p'},
            {'job_id':896543,'job_number':'XYZ-J333333','ship_type':'f'}
        ]";
        JArray result = JArray.Parse(newJson);
        for (int i = 0; i < result.Count; i++)
        {
            Jobs.Add(new Job() { job_id = (string)result[i]["job_id"], job_number = (string)result[i]["job_number"], ship_type = (string)result[i]["ship_type"] });
        }

        lstJobData.ItemsSource = Jobs;
    }
}

internal class Job
{
    public string job_id { get; set; }
    public string job_number { get; set; }
    public string ship_type { get; set; }
}

【讨论】：