Question

我正在尝试从数据库中获取数据并使用AngularJS将其绑定到视图中。为此我写了一个WEM方法如下：

[WebMethod]
public static string getname() {
  SqlHelper sql = new SqlHelper();
  DataTable dt = sql.ExecuteSelectCommand("select cust_F_name from customer");
  Dictionary<string, object> dict = new Dictionary<string, object>();
  object[] arr = new object[dt.Rows.Count];
  for (int i = 0; i <= dt.Rows.Count - 1; i++) {
    arr[i] = dt.Rows[i].ItemArray;
  }
  dict.Add(dt.TableName, arr);
  JavaScriptSerializer json = new JavaScriptSerializer();
  return json.Serialize(dict);
}

我用AngularJS调用它：

var DemoApp = angular.module('DemoApp', []);
DemoApp.factory('SimpleFactory', function ($http) {
  return {
    getCustomer: function () {
      return $http.post('Home.aspx/getname', { name: "" });
    }
  };
});

DemoApp.controller('SimpleController', function ($scope, SimpleFactory) {
  SimpleFactory.getCustomer().then(function(customer){
    $scope.Customer =$.parseJSON( customer.d);
  }, function(error){
    // error handling
  });
});

我将它绑定在这样的视图中：

<html xmlns="http://www.w3.org/1999/xhtml" data-ng-app="DemoApp">
  <head runat="server">
    <title></title>
  </head>
  <body data-ng-controller="SimpleController">
    <form id="form1" runat="server">
      <div>
        Name<input type="text" data-ng-model="Name" />{{ Name }}
        <ul>
          <li data-ng-repeat="customerName in Customer | filter:Name">{{ customerName }}</li>
        </ul>
      </div>
    </form>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular.min.js"></script>
    <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
    <script src="Script/Home.js" type="text/javascript"></script>
  </body>
</html>

但它给了我这个：

enter image description here

请告诉我如何从JSON对象中获取唯一的名称。

Answer 1

$ http方法返回一个promise。

按照设计，promises只用一个参数调用回调。

所以当使用.then(function(customer) {时，'customer'实际上会引用promise对象而不是响应主体。 promise对象具有以下属性：

数据 - {string | Object} - 使用转换函数转换的响应体。
状态 - {number} - 响应的HTTP状态代码。
标题 - {function（[headerName]）} - 标头获取功能。
config - {Object} - 用于生成请求的配置对象。

解决方案：

DemoApp.controller('SimpleController', function ($scope, SimpleFactory) {
  SimpleFactory.getCustomer().then(function(object){
    $scope.Customer = object.data.d;
  }, function(error){
    // error handling
  });
});

此外，您可以使用success和error，传递给这些函数的参数是传递给then方法的响应对象的析构表示。

了解详情：$http docs

Answer 2

如果服务器返回有效的json，则不需要执行parseJSON。只需使用结果

$scope.Customer =customer.d;

无法使用angularJS绑定视图中的数据

2 个答案:

$ http方法返回一个promise。

解决方案：