Convert c# model to an angular model

Question

I am new to angularjs(started today...) and I have an issue with passing model from c# controller to a controller of angularjs.

It seems that I have to call a get method in my angular controller, to call a c# controller from which I will get json and load it to $scope.people for further manipulations:

<script>
    var app = angular.module('myApp', []);
    app.controller('myCtrl', function ($scope, $http) {

        $http({url: "/Home/GetPersons",method: "GET"
            }).success(function (data) {
                $scope.people = data;
            }).error(function (error) {
                $scope.error = "Failed to load";
        });

     });
</script>

Here is my controller :

  [HttpGet]
    public JsonResult GetPersons()
    {
        using (HRMEntities db = new HRMEntities())
        {
            var EmployeeList = db.Employees.Where(e => e.EmployeeId >= 0).ToList();

            return Json(EmployeeList, JsonRequestBehavior.AllowGet);
        }
    }

As a response I get error code 500; What is wrong in the request? And could this be made in easier way? May be using my model which is sent to a view from c# controller @model List<Employee>

500 means server side error, so you need to debug your method to see what's wrong — Alex
– Alex, Commented Sep 30, 2016 at 11:38
I cant get how to debug it..EmployeeList is set, it has 67 elements inside, next step is already return, after which error is shown. — GeekyNuns
– GeekyNuns, Commented Sep 30, 2016 at 11:44
my best guess is that your EmployeeList contains a circular reference of some kind, so it fails to serialize it. do like this: var myJson = Json(EmployeeList, JsonRequestBehavior.AllowGet); return myJson Does it succeed to create the myJson var? — Alex
– Alex, Commented Sep 30, 2016 at 11:53
Creation succeed, myJson.data has 67 elements, but after return myJson there still is an error. — GeekyNuns
– GeekyNuns, Commented Sep 30, 2016 at 11:57
I tend to agree with Joey. Are there any virtual "lazy loaded" properties on your Employee model? If so, you may need to create a DTO or add the [ScriptIgnore] attribute to the virtual properties. — Daryl
– Daryl, Commented Sep 30, 2016 at 11:59

Alex · Accepted Answer · 2016-09-30 12:16:16Z

1

So, after some discussions, the solution to the problem seems to be this:

return Json(EmployeeList.Select(x=>new {Name=x.Name }), JsonRequestBehavior.AllowGet)

Or in other words, creating a Data Transfer Object (DTO) and populating it form EmployeeList

Perhaps there were problems with JSON deserialization.

Glad to help you!

answered Sep 30, 2016 at 12:16

Alex

3,9031 gold badge24 silver badges34 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Jared Kremer · Accepted Answer · 2017-04-06 14:46:33Z

0

Im a little late to this one, but we created this at our company and it is VERY handy to have models that correlate from c# to js (vanilla) and we have angularjs factory model wrappers to extend Domain Model functionality.

https://github.com/castle-it/sharp2Js

answered Apr 6, 2017 at 14:46

Jared Kremer

4191 gold badge4 silver badges8 bronze badges

Collectives™ on Stack Overflow

Convert c# model to an angular model

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related