在来自 Angular Controller 的 Ajax 调用中,我将一个复杂对象作为数据传递。在 MVC Controller 对象上,所有值都为空。 我有如下所示的 MVC View ,它将作为注册客户 View 的样板。
<div data-ng-app="customer" id="customer" data-ng-controller="rootViewModel">
<h2>{{ pageHeading }}</h2>
<hr />
<form id="formElement">
<div ng-view></div>
</form>
使用 AngularJS,我将加载注册客户 View ,注册客户 View 的标记如下。我使用 ng-click
指令注册了与按钮绑定(bind)的客户功能。
<fieldset class="form-horizontal">
<div class="form-group">
<label class="control-label col-sm-3">Company Name</label>
<div class="col-sm-4">
<input class="form-control inputfieldValidation" ng-model="customer.Name" type="text" placeholder="Full company name" required autofocus />
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-3">PAN</label>
<div class="col-sm-4">
<input class="form-control" ng-model="customer.Pan" type="text">
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-3">TIN</label>
<div class="col-sm-4">
<input class="form-control inputfieldValidation" ng-model="customer.Tin" type="text" required />
</div>
</div>
<button class="btn btn-primary proceedNext" id="registerCompany" ng-click="registerCompany(customer)">Register Customer</button>
</fieldset>
我有 Angular Controller ,它具有名为 registerCustomer()
的函数,该函数将在单击注册客户时调用。我在该函数内有一个 ajax 调用,如下所示。
customerModule.controller("CustomerRegistration", function ($scope) {
var initialize = function () {
}
$scope.registerCompany = function (customer) {
$.ajax({
url: 'Home/RegisterCompany',//make sure url exist
data: JSON.stringify({company: customer}),//pass data to action
type:'POST',
success: function (data) {
alert(JSON.stringify(data));
//window.location.href = '@Url.Action("Order")'; //redirect
}
});
}
initialize();
});
在 MVC 上,我有一个名为 Company 的模型,如下所示。
public class Company
{
public string Name;
public string Pan;
public string Tin;
}
我的 MVC Controller 看起来像
[HttpPost]
public JsonResult RegisterCompany(Company company)
{
//Do something
return null;
}
我的 MVC Controller 上总是有空对象,如果缺少任何内容,请帮助我。提前致谢
最佳答案
编辑:看起来您需要 mvc 中的 View 模型或对您的帖子进行修改:
public class CompanyViewModel {
public Company company { get; set; }
}
或者使用data: JSON.stringify(customer)
代替data: JSON.stringify({ company: customer })
这是我们正在开发的网站的一个工作示例。它使用 Riot.js 而不是 Angular,但概念相似。
另请参阅http://www.abeautifulsite.net/postjson-for-jquery/
$.getJSON(self.baseUrl + "/SaveApplicant", $('form.#applicant').serialize(), function (response) {
if (response.errorMessage) {
RiotControl.trigger('error_message', response.errorMessage);
return;
} else {
self.packageQuote.applicant = response;
}
RiotControl.trigger("continue","applicant");
});
或者通过上面的链接使用帖子
$.post(self.baseUrl + "/SaveApplicant", $('form.#applicant').serialize(), function (response) {
if (response.errorMessage) {
RiotControl.trigger('error_message', response.errorMessage);
return;
} else {
self.packageQuote.census = response;
}
RiotControl.trigger("continue","applicant");
},'json');
MVC 方面涉及更多一些内容,即发送回带有小写属性名称前缀的 json 响应:
public ActionResult SaveApplicant(Applicant model)
{
if (ModelState.IsValid)
{
var applicant = DbContext.Applicants.FirstOrDefault(row => row.Id == model.Id);
if (applicant == null) {
DbContext.Applicants.Add(model);
} else {
applicant.Clone(model); // implement as needed or use entity state modified.
}
DbContext.SaveChanges();
return FormattedJsonResult(applicant);
}
return ModelErrors();
}
public ActionResult FormattedJsonResult(object model)
{
var camelCaseFormatter = new JsonSerializerSettings();
camelCaseFormatter.ContractResolver = new CamelCasePropertyNamesContractResolver();
var result = JsonConvert.SerializeObject(model, camelCaseFormatter);
return Content(result, "application/json");
}
public ActionResult ModelErrors()
{
return FormattedJsonResult(
new
{
errorMessage =
String.Join("\n",
ModelState.Values.SelectMany(value => value.Errors).Select(error => error.ErrorMessage))
});
return View();
}
关于javascript - 将复杂对象从 Angularjs Controller 传递到 MVC Controller 不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33156059/