Object reference not set to an instance of an object in Razor

Question

I'm new to Razor and I'm getting this error when trying to loop through a list of objects.

This is my View:

@page
@model QuizModel
@{
    ViewData["Title"] = "Quiz Page";
}

<div class="text-center">
    <h1 class="display-4">Thanks for checking my first website out, @Model.Visitor.Name. Are you ready?</h1>
    <p>Let's see how much you know about me.</a>.</p>
</div>

<div class="text-center">
    <h1 class="display-4">Welcome</h1>
    <form method="post">
        @foreach (var question in @Model.QuestionList)
        {
            <label>@question.Query</label>
        }

        <button type="submit">Send</button>
    </form>
</div>

This is the .cs

namespace myquiz.Pages
{
    public class QuizModel : PageModel
    {
        [ViewData]
        [BindProperty]
        public string Name { get; set; }
        [BindProperty]
        public Visitor Visitor { get; set; }
        public List<Question> QuestionList { get; set; }

        public void OnGet()
        {
            var quizService = new QuizService();
            ///QuestionList = new List<Question>();
            QuestionList = quizService.GetQuestions();
        }

        public void OnPost()
        {
            Name = Visitor.Name;
        }
    }
}

Here's the service

 public class QuizService 
    {
        public List<Question> GetQuestions()
        {
            return new List<Question>()
            {
                new Question()
                {
                    Id=1,
                    Query = "What's my favourite band?",
                    Option1 = "Beatles",
                    Option2 = "Rolling Stones",
                    Option3 = "Led Zeppelin",
                    Answer = "Led Zeppelin"
                },
                new Question()
                {
                    Id=2,
                    Query = "What's my favourite colour?",
                    Option1 = "Pink",
                    Option2 = "Yellow",
                    Option3 = "Maroon",
                    Answer = "Pink"
                },
            };
        }
    }

I tried to initialise the list in the comment but It did't work either :(

Thanks!

Answer 1

You need to initialize both Visitor and QuestionList,because you use them in your view. You can change

[BindProperty]
        public Visitor Visitor { get; set; }
        public List<Question> QuestionList { get; set; }

to

 [BindProperty]
        public Visitor Visitor { get; set; } = new Visitor();
 [BindProperty]
        public List<Question> QuestionList { get; set; } = new List<Question>();

So that you don't need to initialize in OnGet.

Update:

DI for service: Startup：

public void ConfigureServices(IServiceCollection services)
        {
            ...
            services.AddScoped<QuizService, QuizService>();

        }

PageModel:

public readonly QuizService quizService;
        public QuizModel(QuizService q){
            quizService = q;
        }

public void OnGet()
        {

            QuestionList = quizService.GetQuestions();
        }

Answer 2

It's better to see the implementation of quizService.GetQuestions() method. But you can check the variable after the method.

QuestionList = quizService.GetQuestions();
if (QuestionList is null)
    QuestionList = new List<Question>();

It's better to do this check in the GetQuestions() method.