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?
|

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.