无法获取web api json响应的内容，返回空白

我是一个完整的初学者与前端编程;然而，我在后端c＃（非网络的东西）经验丰富。无法获取web api json响应的内容，返回空白

我有2个视觉工作室开放。一个是提供web api，另一个正在使用web api。

如何从远程源读取和显示json？

当试图读取其中一个API时，该页面没有显示任何内容。

我的HTML：

<!doctype html> 
<html ng-app="myApp"> 
<head> 
    <title>Hello AngularJS</title> 

    <script src="Scripts/angular.js"></script> 
    <script src="app.js"></script> 
    <script src="controllers/GbyG.js"></script> 
</head> 

<body ng-controller="GbyG"> 

<table border="1"> 
    <tr ng-repeat="data in greeting"> 
     <td>{{data.FirstName}}</td> 
    </tr> 
</table> 


</body> 
</html>

GbyG.js

'use strict'; 

app.controller('GbyG', 
     function($scope, $http) { 
      $http.get('http://localhost:36059/api/Samples/GetAllSamplesByStatusUser') 
       .success(function(data) { 
        $scope.greeting = data; 

       }); 
     } 

);

app.js JSON的

'use strict'; 
var app = angular.module('myApp', []);

样品，我正在读

[{"Sample":{"sampleid":1,"barcode":"129076","createdat":"2015-01-02T00:00:00","createdby":6,"statusid":3},"Status":"Report Generation","FirstName":"Clint","LastName":"Reid"},{"Sample":{"sampleid":2,"barcode":"850314","createdat":"2015-06-15T00:00:00","createdby":7,"statusid":3},"Status":"Report Generation","FirstName":"Kim","LastName":"Mullins"}]

如何阅读和从远程源显示JSON？

来源

2016-06-28 l--' ' ' ' ' ' ---------' ' ' ' ' ' ' ' ' ' ' '

只是检查'的console.log（数据）'...尝试'$ scope.greeting = data.data;'..阅读[__' $ http' __（HTTPS ：//docs.angularjs.org/api/ng/service/$http） – Rayon

还添加了错误部分，以便在错误发生时查看被调用的内容。 .error（？），也可以看看这个来帮助你的api开发，https：//www.getpostman.com/它也可以给greta错误/响应，如果有任何检查你的api url是好的 –

控制台。 log（data）什么也没有返回 –

参考$http文档

使用.then处理程序，而不是.success作为后来被depricated
访问响应对象data财产，因为它持有data

'use strict'; 
 
var app = angular.module('myApp', []); 
 
app.controller('GbyG', 
 
    function($scope, $http) { 
 
    $http.get('http://thetraveltemple.com/webservices/fetchCountry.php') 
 
     .then(function(data) { 
 
     $scope.greeting = data.data; 
 
     }); 
 
    } 
 
);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<body ng-app="myApp" ng-controller="GbyG"> 
 
    <table border="1"> 
 
    <tr ng-repeat="data in greeting.countries"> 
 
     <td>{{data.country_name}}</td> 
 
    </tr> 
 
    </table> 
 
</body>

来源

2016-06-28 19:03:36 Rayon

在我的机器上试过这个：http://i.imgur.com/Dxe7did.png并得到这个：http://i.imgur.com/FeYpWtb.png –

你没有包括你写的脚本/复制的脚本...从'身体'删除'ng-app' – Rayon

仍然得到相同的结果http：///i.imgur.com/lOBT4GD.png，http://i.imgur.com/WdQxpqN.png –

这里是plnkr http://plnkr.co/edit/1MkV3qJ7WupKkNlybZNT?p=preview

可以更换其他服务，而不是在tag.json get调用，我序用于测试。

您的JSON应该采用这种格式。

[{ 
    "Status": "Report Generation", 
    "FirstName": "Clint", 
    "LastName": "Reid", 
    "Sample": { 
    "sampleid": 1, 
    "barcode": "129076", 
    "createdat": "2015-01-02T00:00:00", 
    "createdby": 6, 
    "statusid": 3 
    } 
}, { 
    "Status": "Report Generation", 
    "FirstName": "Kim", 
    "LastName": "Mullins", 
    "Sample": { 
    "sampleid": 2, 
    "barcode": "850314", 
    "createdat": "2015-06-15T00:00:00", 
    "createdby": 7, 
    "statusid": 3 
    } 

}]

来源

2016-06-28 18:52:53 Deepanjan

感谢您向我介绍plnkr这非常有帮助 –

无法获取web api json响应的内容，返回空白

回答

相关问题