Q:

Knockout js in ASP.net Core 2.1 returns me undefined?

I have a problem with Kcnockout Js, and when he tries to return the result, he returns it to me undifferentiated, I have verified the contractor and if he is returning me data, as shown in the following image,

but when loading the list of values ​​in the view it throws me that it is undefined, as I show in the following image,

I don't know why he sends me that message, this is my controller code,
public JsonResult GetGender()
{
    ServiceResult serviceResult = new ServiceResult();

    serviceResult = this._genderServices.GetListGenders();

    return Json(serviceResult);

}

This is the view code,
<h2>Generos</h2>
<hr />
<p data-bind="visible: IsNewButton">
    <a href="#" data-bind="click: New" class="btn btn-primary">Crear Nuevo</a>
</p>
<div id="divListGenders" data-bind="visible: ShowResult">
    <table class="table">
        <thead>
            <tr>
                <th>
                    Genero
                </th>
                <th></th>
                <th></th>
            </tr>
        </thead>
        <tbody data-bind="foreach: Genders">
            <tr>
                <td style="text-align:left" data-bind="text: GenderName"></td>
                <td style="text-align:center">
                    <a href="#" data-bind="click: $parent.Edit" class=" btn btn-warning"><span class="glyphicon glyphicon-edit"></span></a> |
                    <a href="#" data-bind="click: $parent.Details" class=" btn btn-info"><span class="glyphicon glyphicon-eye-open"></span></a> |
                    <a href="#" data-bind="click: $parent.Delete" class=" btn btn-danger"><i class="fas fa-trash"></i></a>
                </td>
            </tr>
        </tbody>
    </table>
</div>
<div data-bind="visible: IsBackToListButton">
    <a href="#" data-bind="click: BackToList" class="btn btn-info">Regresar</a>
</div>
<script src="~/js/Gender.js"></script>

This is the method that returns the list of genres,
    var LoadListGenders = function () {
        $.ajax({
            url: '/AdminGenders/GetGender',
            data: null,
            dataType: "json",
            type: "POST",
            contentType: "application/json; charset=utf-8",
            async: true,
            success: function (data) {
                if (data.Success) {
                    genderViewModel.Genders.removeAll();
                    genderViewModel.Genders(data.Data);
                }
                else {
                    alert(data.Data);
                }
            },
            error: function (ex) {
                alert('Ocurrión un error, cargando los generos.');
            }
        });

    };

}

I provided it on asp.net MVC 5 and it works well, I don't know why it doesn't work for me in ASP.NET Core 2.1, I'd appreciate the help

A:

In ASP.NET Core the default case for serializing output to JSON is camelcase, whereas it was Pascal case for ASP.NET MVC 5.
Notice that the first image in your post shows all properties is camelcase:
Object { success: true, message: null, data: Array(1) ... }

Similar for the items in the data array: genderId, genderName, etc.
One way to solve this is by updating your javascript code and Knockout bindings by applying camelcase property names.
E.g.
success: function (data) {
    if (data.success) {
        // ....
    }
    else {
        alert(data.data);
    }
}

Alternatively you can chose to configure your Web API to return Pacalcased JSON, e.g. by having the code below in Startup ConfigureServices:
services
    // ...
    .AddJsonOptions(options => {
        options.JsonSerializerOptions.PropertyNamingPolicy = null;
    })
    // ... 

