获取JSON数据从Asp.Net的WebMethod和angularJS消费 [英] Get Json Data From Asp.Net Webmethod and Consume in angularJS
本文介绍了获取JSON数据从Asp.Net的WebMethod和angularJS消费的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
任何一个可以指导我如何从asp.net的WebMethod JSON数据，并在angularJS吃了。
app.controller（'MainController'，['$范围'，函数（$范围，$ HTTP）{
尝试{
$ HTTP（{方法：GET，网址：'ProblemList.aspx / GetProblemList'}）
.success（功能（数据，状态，头，配置）{
警报（数据）; }）错误（功能（数据，状态，头，配置）{
}）;
}赶上（E）{
Ë扔掉;
}
解决方案
我有同样的问题，我尝试了很多不同的方式，这是我发现它的工作方式......（我认为是技巧的结合头配置，并以数据：{}json的参数，我不知道，但它真的很棘手）
＆LT;％@页面语言=C＃AutoEventWireup =真codeBehind =TestAngular.aspx.cs继承=COEWebApp.NCoe.Employees.TestAngular ％GT;＆LT;！DOCTYPE HTML＆GT;
＆LT; HTML LANG =ENGT＆;＆LT; HEAD＆GT;
＆所述; SCRIPT SRC =https://ajax.googleapis.com/ajax/libs/angularjs/1.2.5/angular.min.js＆GT;＆下; /脚本＆GT;
＆LT; /头＆GT;＆LT;机身NG-应用程序=的myapp＆GT; ＆LT; DIV NG控制器=myController的＆GT;
＆LT;按钮NG点击=myData.doClick（项目，$事件）＆GT;发送Ajax请求＆LT; /按钮＆GT;
＆LT; BR /＆GT;
从服务器的数据：{{myData.fromServer}}
＆LT; / DIV＆GT; ＆LT;脚本＆GT;
angular.module（MyApp的，[]）
.controller（myController的功能（$范围，$ HTTP）{
$ scope.myData = {};
$ scope.myData.doClick =函数（项目，事件）{ $ http.post（'TestAngular.aspx /装getEmployees'，{数据：{}}）
.success（功能（数据，状态，头，配置）{
$ scope.myData.fromServer = data.d;
}）
.error（功能（数据，状态，头，配置）{
$ scope.status =状态;
}）; }
}）。配置（函数（$ httpProvider）{ $ httpProvider.defaults.headers.post = {}; $ httpProvider.defaults.headers.post [的Content-Type] =应用/ JSON的;字符集= UTF-8; }）;
＆LT; / SCRIPT＆GT;＆LT; /身体GT;＆LT; / HTML＆GT;
而在codebehid同一aspx页面上，这是简单的code ...
[的WebMethod]
公共静态字符串装getEmployees（）
{
返回OK测试;
}
Can any one guide me how to get json data from asp.net webmethod, and consume it in angularJS.
app.controller('MainController', ['$scope', function ($scope, $http) {
try {
$http({ method: 'GET', url: 'ProblemList.aspx/GetProblemList' })
.success(function (data, status, headers, config) {
alert(data); }).error(function (data, status, headers, config) {
});
} catch (e) {
throw e;
}
解决方案
I had the same issue, I tried many different ways, this is the way I found it works... ( I think the tricks is a combination of the header config, and the json parameter with "data : {}", I am not sure but It was really tricky )
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="TestAngular.aspx.cs" Inherits="COEWebApp.NCoe.Employees.TestAngular" %>
<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.5/angular.min.js"></script>
</head>
<body ng-app="myapp">
<div ng-controller="MyController" >
<button ng-click="myData.doClick(item, $event)">Send AJAX Request</button>
<br/>
Data from server: {{myData.fromServer}}
</div>
<script>
angular.module("myapp", [])
.controller("MyController", function ($scope, $http) {
$scope.myData = {};
$scope.myData.doClick = function (item, event) {
$http.post('TestAngular.aspx/GetEmployees', { data: {} })
.success(function (data, status, headers, config) {
$scope.myData.fromServer = data.d;
})
.error(function (data, status, headers, config) {
$scope.status = status;
});
}
}).config(function ($httpProvider) {
$httpProvider.defaults.headers.post = {};
$httpProvider.defaults.headers.post["Content-Type"] = "application/json; charset=utf-8";
});
</script>
</body>
</html>
And on the same aspx page on the codebehid this is the simple code...
[WebMethod]
public static string GetEmployees()
{
return "OK-test";
}
这篇关于获取JSON数据从Asp.Net的WebMethod和angularJS消费的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
