Member not found in data context

I am trying to bind the ImageSource property of the NewGames class to the Source property of an Image control in a CarouselView but i keep getting the same error. Here is my code.

New Game Class 

namespace FYP.ViewModels
{
    public class NewGames
    {
        public int Id { get; set; }
        public string GameTitle { get; set; }
        public double Rating { get; set; }
        public string ImageSource { set; get; }
    }
}

This is my view model

using System.ComponentModel;
using System.Text;

namespace FYP.ViewModels
{

    public class NewReleasesViewModel : INotifyPropertyChanged
    {
        public event PropertyChangedEventHandler PropertyChanged;

        private ObservableCollection<NewGames> NewGames;

        public ObservableCollection<NewGames> Games
        {
            get { return NewGames; }
            set { NewGames = value;

                PropertyChanged?.Invoke(this, new PropertyChangedEventArgs("Games"));
            }
        }

        public NewReleasesViewModel() 
        {
            Games = new ObservableCollection<NewGames>();
            AddData();
        }
        private void AddData()
        {
            Games.Add(new NewGames
            {
                Id = 0,
                GameTitle = "The Elder Scrolls Online",
                Rating = 4.9,
                ImageSource= "https://assets-prd.ignimgs.com/2022/01/05/elderscrollsonline-                             1641413357689.jpg"
            });
            Games.Add(new NewGames
            {
                Id = 1,
                GameTitle = "World Of Warcraft",
                Rating = 4.9,
                ImageSource = "https://assets-prd.ignimgs.com/2021/12/10/wow-1639126324635.jpg"
            });
            Games.Add(new NewGames
            {
                Id = 2,
                GameTitle = "Star Wars: The Old Republic",
                Rating = 4.9,
                ImageSource = "https://assets-prd.ignimgs.com/2022/01/27/swotor-sq1-1643302998212.jpg"
            });


        }
    }
}

And this is where i am trying to bind it to

            <CarouselView.ItemTemplate>
                <DataTemplate>
                    <StackLayout>
                        <Frame HeightRequest="300" 
                             WidthRequest="180" 
                             BackgroundColor="white" 
                             Padding="0" 
                             CornerRadius="10"
                             HasShadow="True" 
                             Margin="15"
                             HorizontalOptions="CenterAndExpand">

                            <Grid>
                                <StackLayout BackgroundColor="DimGray">
                                <Image Source="{Binding ImageSource}" Aspect="AspectFill"></Image>
                                </StackLayout>

                                <StackLayout Margin="-5">
                                <Label Text="{Binding GameTitle}" 
                                        TextColor="PaleGoldenrod"
                                        FontSize="18" 
                                        FontAttributes="Bold"
                                        Margin="15"
                                        VerticalOptions="EndAndExpand"/>
                                </StackLayout>
                            </Grid>
                        </Frame>
                    </StackLayout>
                </DataTemplate>
            </CarouselView.ItemTemplate>

It seems i am binding the NewGames class correcly because the carouselView is getting populated but for some reason none of the properties of the class go through and i don’t know why. Hopefully this helps you guys understand was i am trying to do.

>Solution :

You’re using compiled bindings when you’re using the x:DataType property.

In order to make your bindings work like you expect, you need to explicitly set the x:DataType whenever the context changes. This is usually the case when you’re using a DataTemplate.

In your case this would be something like this:

<CarouselView ItemsSource={Binding Games}>
    <CarouselView.ItemTemplate>
        <DataTemplate
            x:DataType="local:NewGames">
            <StackLayout>
            <!-- ... -->
            </StackLayout>
        </DataTemplate>
    </CarouselView.ItemTemplate>
</CarouselView>

Where it says "local:NewGames" you need to put the correct namespace and class name.