错误 XFC0045 - 如何将 CarouselView 绑定到毛伊岛的 ObservableCollection？

Question

我正在尝试将

ObservableCollection

绑定到

<CarouselView>

。在

CarouselView

内，我有一个

<Label>

，我试图将其绑定到

ObservableCollection

内的公共属性。但是，在编译时，我收到错误：

错误 XFC0045：绑定：在 StudentPageModel 上找不到属性“CoursesName”

我已经验证

StudentPageModel

中的API调用在页面加载时按预期工作（通过注释掉CarouselView）并且正确的数据可用于绑定。

StudentPageModel.cs

public partial class StudentPageModel() : ObservableObject
{

    [ObservableProperty]
    private string _studentId = string.Empty;
    
    [ObservableProperty]
    private StudentModel? _student;

    public ObservableCollection<StudentCourses>? CourseCollection { get; set; }
    

    public async Task OnAppearing()
    {
        Student = await GetStudent("A100");

        // Verified that data is getting populated in both Students and CourseCollection
        if (Student is { StudentCourses: not null })
        {
            CourseCollection = new ObservableCollection<StudentCourses>(Students.StudentCourses);
        }        
    }
}

StudentModel.cs

public class StudentModel : ObservableObject
{
    public string? StudentId { get; set; }

    public string? Name { get; set; }

    public string? Major {get; set;}

    public double GPA {get; set;}

    public ObservableCollection<StudentCourses>? CoursesTaken { get; set; }
    
}

学生课程.cs

public class StudentCourses
{
    public string? Id { get; set; }
    
    public string? CoursesName { get; set; }

    public string? CoursesGrade { get; set; }

    public string? CoursesCredit { get; set; }

    public string? CoursesSemester { get; set; }
}

学生API调用

public class StudentLoader() : IStudentManager
{    
    public async Task<StudentModel> GetStudent(string studentId)
    {
        try
        {
            var response = await studentAPI.GetStudentAsync(taskId);

            List<StudentCourses>? courses = response.Courses?.Select(course => new StudentCourses
            {
                Id = course.Id,
                CoursesName = course.CoursesName,
                CoursesGrade = course.CoursesGrade,
                CoursesCredit = course.CoursesCredit,
                CoursesSemester = course.CoursesSemester
            }).ToList();
            
            StudentModel student = new()
            {
                StudentId = response.StudentId,
                Name = response.Name,
                Major = response.Major,
                GPA = response.GPA
            };

            if (courses != null)
            {
                student.Courses = new ObservableCollection<StudentCourses>(courses);
            }

            return student;
        }
    }
}

学生页面.xaml

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:vm="clr-namespace:StudentManager.ViewModels"
             x:Class="StudentManager.Pages.StudentPage"
             xmlns:controls="clr-namespace:StudentManager.Controls"
             x:DataType="vm:StudentPageModel">

    <ContentPage.Content>
        <VerticalStackLayout>
            <Label Text="{Binding StudentId}"
                   Margin="10,8,10,8"
                   />
            <Label Text="{Binding Name}"
                   Margin="10,8,10,8"
                   />
            <CarouselView ItemsSource="{Binding CourseCollection}"
                          CurrentItem="{Binding SelectedCourse}">
                <CarouselView.ItemTemplate>
                    <DataTemplate>
                        <StackLayout>
                            <Label Text="{Binding CoursesName}"
                                   FontAttributes="Bold"
                                   FontSize="18"
                                   HorizontalOptions="Center"
                                   VerticalOptions="Center" />
                                    
                        </StackLayout>
                    </DataTemplate>
                </CarouselView.ItemTemplate>
            </CarouselView>
        </VerticalStackLayout>
    </ContentPage.Content>
</ContentPage>

Answer 1

CarouselView

内的绑定上下文是

StudentCourses

类型，而您之前在ContentPage级别

x:DataType="vm:StudentPageModel"

上的声明与此相冲突，您必须为您的

CarouselView

x:DataType="vm:StudentCourses"

指定：

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:vm="clr-namespace:StudentManager.ViewModels"
             x:Class="StudentManager.Pages.StudentPage"
             xmlns:controls="clr-namespace:StudentManager.Controls"
             x:DataType="vm:StudentPageModel">
...
            <CarouselView x:DataType="vm:StudentCourses" ...