无法使用angularJS绑定视图中从数据库获取的数据

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>

但这给了我这个：

在此处输入图片说明

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

Answer 1

$ http方法返回一个承诺。

按照设计，promise仅使用一个参数调用回调。

因此，当使用.then(function(customer) { ，“ customer”实际上将引用一个promise对象而不是响应主体。promise对象具有以下属性：

data – {string | Object} –使用转换函数转换的响应主体。
status – {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 个解决方案

解决方案1
1 2014-01-11 19:09:46

$ http方法返回一个承诺。

解：

解决方案2
0 2014-01-11 07:07:21

无法使用angularJS绑定视图中从数据库获取的数据

问题描述

2 个解决方案

解决方案1 1 2014-01-11 19:09:46

$ http方法返回一个承诺。

解：

解决方案2 0 2014-01-11 07:07:21

解决方案1
1 2014-01-11 19:09:46

解决方案2
0 2014-01-11 07:07:21