[C#]在 AngularJS 的消费 Wcf 数据服务。

标签: json WCF AngularJS C#
发布时间: 2017/2/24 2:54:55
注意事项: 本文中文内容可能为机器翻译,如要查看英文原文请点击上面连接.

我新到 AngularJS。我试图使用 Wcf 数据服务与 AngularJS。我总是失败,不知道的东西要去哪里错了。有人能帮我在这上。谢谢你。

数据服务将返回 Json,如果像这样的查询︰

http://localhost/Wcf/DataService/Report/ReportService.svc/SystemCategories?$format=json

示例 Json 返回︰

{"odata.metadata":"http://localhost/Wcf/DataService/Report/ReportService.svc/$metadata#SystemCategories","value":[
    {"ID":1,"SystemName":"System-A","Description":"System A"},
    {"ID":2,"SystemName":"System-B","Description":"System B"},
    {"ID":3,"SystemName":"System-C","Description":"System C"}]}

代码 (从 w3school 的示例)

<!DOCTYPE html>
<html>
<script src= "http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<body>
<div ng-app="myApp" ng-controller="systemCat"> 
<ul>
  <li ng-repeat="x in categories">
    {{ x.ID + ', ' + x.SystemName }}
  </li>
</ul>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('systemCat', function($scope, $http) {
  $http.get("http://localhost/Wcf/DataService/Report/ReportService.svc/SystemCategories?$format=json")
  .success(function (response) {$scope.categories = response.value;});
});
</script>
</body>
</html>

解决方法 1:

这段代码应该工作,如果不是看看 javascript 控制台,无论你在那里找到的错误会给你一些想法究竟怎么了。

<script>
  var app = angular.module('myApp', []);
  app.controller('systemCat', function($scope, $http) {
    $http.get('http://localhost/Wcf/DataService/Report/ReportService.svc/SystemCategories?$format=json')
      .success(function (data) {
        console.log(data);
        $scope.categories = data.value;
      })
      .error(function (data) {
        console.log('error!');
      });
  });
</script>
官方微信
官方QQ群
31647020