Question

仍在尝试追踪为什么我无法显示来自asp.net webmethod的json数据，并且不会使用ng-repeat显示在表格中 - 我已经达到了看起来有问题的程度我的json，但我没有看到问题与服务器json的表 - 我添加了一个索引列，似乎每个字符添加一行??

这是数据的屏幕截图 - 来自服务器的json数据和手动创建的角度集合看起来像我的json数据

感谢您的任何见解

enter image description here

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Test1.aspx.cs" Inherits="SampleAngularjs.Test1" %>

<!DOCTYPE html>
<html  >

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

<body ng-app="codeapp">

  <div ng-controller="CodeController" >
    <button ng-click="doClick(item, $event)">Send AJAX Request</button>
    <br />
    Data from server: {{codes}}
    <br />
    Data from Manually built Collection: {{fields}}
    <br />

    <h3>And here is what you get if you just return the promise returned by $http.get():</h3>
    <pre>{{codes | json}}</pre>

     <br />
    <h3>Manually Built Angular Collection Table</h3>
    <table>
    <tr>
        <th>Code</th>
        <th>Desc</th>

    </tr>
    <tr ng-repeat="code in fields">
        <td>{{code.Code}}</td>
        <td>{{code.Desc}}</td>

    </tr>

   </table>

    <br />
    <h3>Server Json Table</h3>
    <table>
    <tr>
        <th>Row</th>
        <th>Code</th>
        <th>Desc</th>

    </tr>
    <tr ng-repeat="code in codes track by $index">
        <td>({{$index + 1}}) </td>
        <td>{{code.Code}}</td>
        <td>{{code.Desc}}</td>

    </tr>

   </table>

  </div>

   <script>
       angular.module("codeapp", [])
           .controller("CodeController", function ($scope, $http) {

               $scope.fields = [{ Code: "aaa", Desc: "aaa, desc" }, { Code: "bbb", Desc: "bbb, desc" }];

               $scope.codes = [];

               $scope.doClick = function (item, event){

                   $http.post('Test1.aspx/GetAllCodes', { data: {} })
                     .success(function (data, status, headers, config) {
                         $scope.codes = 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>

Answer 1

您从服务器获取一个字符串，并在字符串上使用ng-repeat为您提供每个字符。尝试自己解析它以查看它是否有效，然后检查请求和响应标头，看看为什么它没有以application/json的形式发回数据：

.success(function (data, status, headers, config) {
    $scope.codes = JSON.parse(data.d);
})

ng-repeat解析json的每个字符

1 个答案: