javascript 如何在angularjs的ng-grid中显示json数据
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/23192364/
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 display json data in ng-grid in angularjs
提问by Shekkar
I am new to Angularjs , I want to display the JSON data from webservice response to in grid form by using ng-grid .My code is here
我是 Angularjs 的新手,我想使用 ng-grid 以网格形式显示来自 webservice 响应的 JSON 数据。我的代码在这里
function TestController($scope, $http) {
alert("test");
$http({
url: 'http://my_Personal_Url',
method: "POST",
data: postData,
headers: {'Content-Type': 'application/jsonp'}
}).success(function (data, status, headers, config) {
$scope.persons = data; //
}).error(function (data, status, headers, config) {
alert("test2");
$scope.status = status;
});
But In the above code the PostData is not defined.my ng-grid scope is like this
但是在上面的代码中没有定义 PostData。我的 ng-grid 范围是这样的
$scope.gridOptions = {
data: 'myData',
columnDefs: [
{field: 'DirectLine', displayName: 'DirectLine'},
{field:'Email', displayName:'Email'}
{field:'Employee', displayName:'Employee'}
{field:'Extention', displayName:'Extention'}
{field:'Id', displayName:'Id'}
{field:'PhoneNumber', displayName:'PhoneNumber'}
{field:'Title', displayName:'Title'}
]
};
NOw how can i get the data from json object to myData ? so that i can use ng-grid as
现在如何将数据从 json 对象获取到 myData ?这样我就可以使用 ng-grid 作为
<div ng-controller="TestController">
<div class="gridStyle" ng-grid="gridOptions"></div>
</div>
here the my personal url (it is confidential so i don't want to show ) The above code shows sometimes as postData is not defined and sometimes getting 405 error .
这里是我的个人网址(它是机密的,所以我不想显示)上面的代码有时会显示为 postData 未定义,有时会出现 405 错误。
Please explain the problem with the plunker link
请解释plunker链接的问题
采纳答案by Alex Choroshin
The 'data' property in ng-grid accepts the name of the data object, in your case the name is "persons" since the response from your HTTP request goes to $scope.persons
.
ng-grid 中的“ data”属性接受数据对象的名称,在您的情况下,名称为“persons”,因为您的 HTTP 请求的响应转到$scope.persons
.
Example:
例子:
$scope.gridOptions = {
data: 'persons',
columnDefs: [
{field: 'DirectLine', displayName: 'DirectLine'},
{field:'Email', displayName:'Email'}
{field:'Employee', displayName:'Employee'}
{field:'Extention', displayName:'Extention'}
{field:'Id', displayName:'Id'}
{field:'PhoneNumber', displayName:'PhoneNumber'}
{field:'Title', displayName:'Title'}
]
};
Live example: http://plnkr.co/edit/UndbtO?p=preview