Error in Getting Started Exampel from README.MD

[Björn Fällbom]

Describe the bug

Can't successfully get the example pie chart from README.md Getting Started section working. Problem is with this line: _config.Data.Labels.AddRange(new string[] { "Red", "Yellow", "Green", "Blue" });
IntelliSense reports this problem: 'IList' does not contain a definition for 'AddRange' and no accessible extension method 'AddRange' accepting a first argument of type 'IList' could be found (are you missing a using directive or an assembly reference?) [BlazorProject]csharp(CS1061)

Which Blazor project type is your bug related to?

• Client-Side

Which charts does this bug apply to?

PieChart

To Reproduce

Steps to reproduce the behavior:

1. Using this version of ChartJSBlazor:
2. Create new project using: dotnet new blazorwasm -o BlazorProject & dotnet add package ChartJs.Blazor.Fork
3. Follow the instructions from README.md and copy / paste the code examples listed there.
4. See error: IntelliSense reports this problem: 'IList' does not contain a definition for 'AddRange' and no accessible extension method 'AddRange' accepting a first argument of type 'IList' could be found (are you missing a using directive or an assembly reference?) [BlazorProject]csharp(CS1061)

Expected behavior

That example code is correct and works out of the box.

Additional context / logging

I replaced the line causing the problem with the following to make it work:

string[] dataLabels = { "Red", "Yellow", "Green", "Blue" };
    foreach (var label in dataLabels)
    {
        _config.Data.Labels.Add(label);
    }

Code example

Please provide full code examples below where possible to make it easier for the developers to check your issues.
Please also add the working JavaScript equivalent so we can see what you were trying to achieve.

@page "/"

<h1>Hello, world!</h1>

Welcome to your new app.

<Chart Config="_config"></Chart>

@code {
    private PieConfig _config;

protected override void OnInitialized()
{
    _config = new PieConfig
    {
        Options = new PieOptions
        {
            Responsive = true,
            Title = new OptionsTitle
            {
                Display = true,
                Text = "ChartJs.Blazor Pie Chart"
            }
        }
    };



    _config.Data.Labels.AddRange(new string[] { "Red", "Yellow", "Green", "Blue" });

    PieDataset<int> dataset = new PieDataset<int>(new[] { 6, 5, 3, 7 })
    {
        BackgroundColor = new[]
        {
            ColorUtil.RandomColorString().ToString(),
            ColorUtil.RandomColorString().ToString(),
            ColorUtil.RandomColorString().ToString(),
            ColorUtil.RandomColorString().ToString()
        }
    };

    _config.Data.Datasets.Add(dataset);
}
}

[Joel L.]

Oh god that is embarrassing. I'm really sorry.

Fixed in 7d6ee10

FYI Here's how this compiles in our samples:

public static void AddRange<T>(this IList<T> list, IEnumerable<T> items)
{
    if (list == null)
        throw new ArgumentNullException(nameof(list));

    if (items == null)
        throw new ArgumentNullException(nameof(items));

    if (list is List<T> asList)
    {
        asList.AddRange(items);
    }
    else
    {
        foreach (T item in items)
        {
            list.Add(item);
        }
    }
}

Btw great issue, thank you for including all the details even with such a stupid error :)

[Björn Fällbom]

No worries man! Still very much figuring things out in C# and wasn't half sure I wasn't doing something wrong on my end so figured the more info the better.

I did have a look in the samples by the way and unless I'm mistaking (like I said, very new to this) the same error is present there.

File: ChartJs.Blazor/ChartJs.Blazor.Samples/Client/Pages/Charts/Pie.razor
Line: 39 _config.Data.Labels.AddRange(new string[InitalCount] { "Red", "Orange", "Yellow", "Green", "Blue" });

[Joel L.]

You're correct but in the samples we have that AddRange extension method just like some SampleUtils so it does compile there :)

[Björn Fällbom]

Yeah, I can see it now. Thank you for your patience! 😄