javascript 如何从angular js调用MVC控制器操作方法
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/34143307/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
how to call MVC Controller Action method from angular js
提问by Rama
I am displaying the results on an angular js interface through Web API calls in MVC.
我正在通过 MVC 中的 Web API 调用在有角度的 js 界面上显示结果。
But then, based on some selections, I would need to pass some parameters and call the following MVC Controller method that downloads a file.
但是，根据一些选择，我需要传递一些参数并调用以下下载文件的 MVC 控制器方法。
public ActionResult Downloadfile(string selectedIds, string selecteddefs, DateTime date)
{
// do some stuff here
var file = new FileStreamResult(memoryStream, "application/vnd.openxmlformats-officedocument.wordprocessingml.document")
{
FileDownloadName = string.Format("download_{0}.docx", DateTime.Now.ToString("ddMMyyyyHHmmss"))
};
return file;
}
This is a normal MVC Controller which does not inherit from ApiController.If I make the http post like below in the angular function, it's not downloading file thought it hits the controller method. This is probably, it's returning json data rather than downloading a file.And I should not do this I think, since the Controller is a normal MVC one, does not inherit ApiController.
这是一个普通的 MVC 控制器，它不是从 ApiController 继承的。如果我在 angular 函数中像下面这样制作 http 帖子，它不是下载文件，认为它击中了控制器方法。这可能是，它返回 json 数据而不是下载文件。我认为我不应该这样做，因为控制器是一个普通的 MVC 控制器，不继承 ApiController。
$http.post('/ControllerName/MethodName?selectedIds=' + selectedIds + '&selecteddefs=' + selecteddefs + '&date=' + date, {});
So I tried the normal jquery like below.
所以我尝试了像下面这样的普通 jquery。
$.ajax({
url: "/ControllerName/ActionName",
data: { 'selectedIds': selectedIds.toString(), 'selecteddefs': selecteddefs.toString(), 'date': date },
type: "POST"
});
The above hits the Controller method and does all the work, but then again not able to download any file.
以上击中了控制器方法并完成了所有工作，但又无法下载任何文件。
How can I call a normal MVC Controller Action method where the functionality of the method is just to download a file. There is no problem with Action method. Could anyone please help.
如何调用普通的 MVC 控制器操作方法，其中该方法的功能只是下载文件。Action方法没有问题。任何人都可以请帮忙。
I have tried the following.But it does not hit the controller Action.
我已经尝试了以下。但它没有击中控制器动作。
$http({
method: 'POST',
url: '/Controller/ActionName',
data: $httpParamSerializerJQLike({ nodeIds: JSON.stringify(nodes.toString()), glossaryTermIds: JSON.stringify(glossaryterms.toString()), date: JSON.stringify(date.toString()) }),
headers: { 'Content-Type' : 'application/x-www-form-urlencoded'}
})
.then(function (result){
}, function (result) {
});
回答by Sagi
No need for complicated Posts, use this the angular window object instead of the location object:
不需要复杂的帖子，使用这个角度窗口对象而不是位置对象：
$window.location.assign("/ControllerName/ActionName");
回答by Saurabh Kumar
It's quite simple to invoke ASP.Net MVC Controller action method using AngularJS as follows:
使用 AngularJS 调用 ASP.Net MVC 控制器操作方法非常简单，如下所示：
In Javascript I wrote:
在 Javascript 中，我写道：
var app = angular.module('MyApp', []);
angular.module('MyApp', [])
.controller('MyController', ['$scope', '$http', function ($scope,
$http) {
$scope.search = function () {
$http({
method: "GET",
url: "/home/GetData"
}).then(function mySuccess(response) {
$scope.name = response.data;
}, function myError(response) {
$scope.name = response.statusText;
});
}
}]);
In HTML part, I wrote:
在 HTML 部分，我写道：
<button ng-click="search()">Get Data</button>
In Controller Action, I wrote:
在控制器操作中，我写道：
return Json("You caught AngularJS", JsonRequestBehavior.AllowGet);
回答by Ashutosh Singh
Use $resource service of angularJS to create http requests
使用angularJS的$resource服务创建http请求
$resource('host/ControllerName/ActionName').get();
you can pass parameters as well.
你也可以传递参数。
回答by Chris Hermut
It's quite common mistake when using AngularJs with C#. Wasted some of my time a while ago.
在 C# 中使用 AngularJs 时，这是一个很常见的错误。前段时间浪费了我的一些时间。
You have to use $httpParamSerializerJQLike as a dependency and a sample request should look like:
您必须使用 $httpParamSerializerJQLike 作为依赖项，示例请求应如下所示：
$http({
method: 'POST',
url: 'ControllerName/MethodName',
data: $httpParamSerializerJQLike({ blah: JSON.stringify(data)}),
headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
})
.then(function (result) {
// Success
}, function (result) {
// Error
});
AngularJs is using 'application/json' as Content-Type by default.
默认情况下，AngularJs 使用“application/json”作为 Content-Type。
