0

My C# model:

public class MyModel
{
    public string MyString { get; set; }
    public int MyInt { get; set; }
    public List<MyList> MyList { get; set; }
}

public class MyList
{
    public string MyListString { get; set; }
    public int MyListInt { get; set; }
}

My C# method:

[HttpPost]
public void SomeMethod(MyModel MyModel)
{

My AngularJS $http:

$http({
    url: "/api/SomeCtrl/SomeMethod",
    method: "POST",
    data: // WHAT TO PUT HERE?
    headers: { 'Content-Type': 'application/json' }
});

I'm able to fill MyModel with:

data: transportDocumentData.TDShipment,

Or MyList which is present in MyModel with:

data: JSON.stringify({ Package: transportDocumentData.TDShipment.packageData }),

But I don't know how to fill them both. I tried with both options:

$http({
    url: "/api/SomeCtrl/SomeMethod",
    method: "POST",
    data: myModelData.MyModel,
    data: JSON.stringify({ MyList: myModelData.MyModel.myListData }),
    headers: { 'Content-Type': 'application/json' }
});

Which won't work, because the second data overwrites the first one. I also tried this:

var abc = myModelData.MyModel;
$http({
    url: "/api/SomeCtrl/SomeMethod",
    method: "POST",
    data: JSON.stringify({ MyList: myModelData.MyModel.myListData }), abc
    headers: { 'Content-Type': 'application/json' }
});

But in this case only the MyList is filled.

I tried to modify MyMethod like this:

[HttpPost]
public void SomeMethod(List<MyModel> MyModel)
{

With even worse results.

So, how is it done correctly?

EDIT: I forgot to include these:

$scope.myListData = [{ myListString: "bar", myListInt: 5 }];

$scope.myData = {
    myString: "foo",
    myInt: 3,
    myListData: $scope.myListData
}

 var myModelData = {
    MyModel: $scope.myData
};
1
  • So, send myData - that one will match your model in WebApi ;) You don't need myModelData. (name of variable in WebApi action is not important in that context, only the type must match). Commented Jun 23, 2017 at 15:33

1 Answer 1

1

You need just create a JSON object, will match your C# model and send it - that's all. WebApi will do the job (Model binding).

So answering your question:

data: // WHAT TO PUT HERE?

create/fill your json model in Angular:

$scope.myListData = [{ myListString: "bar", myListInt: 5 }];

$scope.myData = {
    myString: "foo",
    myInt: 3,
    myListData: $scope.myListData
};

and pass it trough directly:

$http({
    url: "/api/SomeCtrl/SomeMethod",
    method: "POST",
    data: $scope.myData
});


Is that answer on your question?

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

8 Comments

I updated my question in order to make things more clearer. I already have what you suggested in my code.
I have updated my answer using your example - just send myData - that one will match your model in WebApi ;) You don't need myModelData.
I already tried your solution myself. This way public List<MyList> MyList { get; set; } won't fill. I also tried public MyList MyList { get; set; }, just to be sure, with the same outcome.
Hmm... I just found a small issue in your example: in C# model you have public List<MyList> MyList { get; set; } so the name of the properties in the Angular model should be myList but with your example is myListData - check this in your code, please?
Also, the issue can be with Binding a data you sending - WebApi is using Newtonsoft to deserialize JSON object... I had in the past issue with that - my model was null, because of exception during deserialization but the exception was caused by invalid data I have sent from Angular. I have found that by debugging, it was very deep, so I don't remember exactly how to find it. However, you can see in browser developer tools what data you sending from Angular, try to investigate if all is ok?
|

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.