2017-06-20 2 views
-1

{"tblSupplierMaster":[{"SupplierID": "SupplierCode": "VLTPX01"、 "SupplierName": "TOOLEX PRECISION SDN BHD"、 "State": "Selangor"、 "Country": "Malaysia" "、" SupplierID ":" SupplierCode ":" VSLBK01 "、" SupplierName ":" LEE BOON KWANG NRIC 710902-10-5407 "、" State ":" Selangor "、" Country ":" Malaysia "} 「サプライヤーコード」:「VLGXX03」、「SupplierName」:「GLOMATION SDN BHD」、「State」:「Selangor」、「Country」:「Malaysia」}、{"SupplierID":4、 "SupplierCode": "VLJJL01"、 "SupplierName": "JJ-LAPP CABLE(M)SDN BHD"、 "State": "Selangor"、 "Country": "Malaysia"}、{"SupplierID":5、 "SupplierCode "、" SupplierID ":6、" SupplierCode ":" VLABX01 ":" VLIXX01 "、" SupplierName ":" INDPRO(MALAYSIA)SDN BHD "、" State ":" Selangor "、" Country " "サプライヤーID": "サプライヤーコード": "VLAXX05"、 "サプライヤー名": "ALSIGNOL"、 "サプライヤーID": "サプライヤーID": "サプライヤーID": "サプライヤーID": "サプライヤーID": "AMACERAAL BELTECH SDN BHD" SDN BHD "、" State ":" Selangor "、" Country ":" Malaysia "}、{" Su 「SupplierID」:「SupplierID」:「SupplierID」:「J & Yエンジニアリングワーク」、「State」:「Selangor」、「Country」:「Malaysia」}、「SupplierID」:8、「SupplierCode」: 「SupplierCode」:「SupplierCode」:「SupplierCode」:「VLSLS01」、「SupplierName」:「SLS BEARINGS(MALAYSIA)SDN BHD」、「State」:「Selangor」、「Country」:「Malaysia」} VEKKT01" 、 "SupplierName": "キーンKEONG TIRE & BATTERYサービス"、 "国家": "セランゴール"、 "国": "マレーシア"}]}AngularJSのng-repeatを使用して、データセットからHTMLテーブルに変換されたJSONデータをバインドする方法はありますか?

上記はWebサービス経由で変換されたDataSetのデータであり、次のコードとして

public class SupplierWebService : System.Web.Services.WebService 
{ 

    [WebMethod] 
    public void fnGetSupplier() 
    { 
     DataSet dsSupplierMaster = null; 
     clsPurchasingBO obj = new clsPurchasingBO(); 
     dsSupplierMaster = clsPurchasingBL.fnGetSupplierMaster(obj); 
     //Context.Response.Write(DataSetExt.GetJSON(dsSupplierMaster)); 
     Context.Response.Write(Newtonsoft.Json.JsonConvert.SerializeObject(dsSupplierMaster)); 
     //return Newtonsoft.Json.JsonConvert.SerializeObject(; 
    } 
} 

私のHTMLテーブルに上記のデータをバインドしたい、私のtr Y:

<html> 
<head> 
    <title></title> 
</head> 
<body ng-app="SupplierModule" > 
    <div ng-controller="SupplierController"> 
     <table border="1"> 
      <thead> 
       <tr> 
        <th> 
         SupplierID 
        </th> 
        <th> 
         SupplierCode 
        </th> 
        <th> 
         SupplierName 
        </th> 

        <th> 
         State 
        </th> 

        <th> 
         Country 
        </th> 
       </tr> 
      </thead> 
      <tbody> 
       <tr ng-repeat="supplier in Suppliers"> 
        <td><label ng-repeat="n in supplier.tblSupplierMaster">{{n.SupplierID}}</label></td> 
        <td>{{supplier.SupplierCode}}</td> 
        <td>{{supplier.SupplierName}}</td> 
        <td>{{supplier.State}}</td> 
        <td>{{supplier.Country}}</td> 
       </tr> 
      </tbody> 
     </table> 
    </div> 
    <script src="../JS/angular.min.js"></script> 
    <script src="../JS/angular-route.min.js"></script> 
    <script src="../Controller/SupplierController.js"></script> 
</body> 
</html> 

スクリプト(コントローラ)は以下の通りです:

/// <reference path="../JS/angular-route.min.js" /> 
/// <reference path="../JS/angular.min.js" /> 
var app = angular.module("SupplierModule", []); 
app.controller("SupplierController", function ($scope, $http) { 
    $http.get('/Code/SupplierWebService.asmx/fnGetSupplier') 
    .then(function (response) { 
     $scope.Suppliers = response.data; debugger; 
    }); 

}); 

私の観察

私は問題は、データセットから変換されたJSONデータであることので、観察戻り値データにデータテーブル名 'tblSupplierMaster'が含まれているため、バインドされていません。以下は

はスクリーンショットです: enter image description here

+2

あなたがこれを行うことができます: '$ scope.Suppliers =応答を。 data.tblSupplierMaster; ' –

+0

おかげでPrera​​k、ちょうど私が望んでいた。 –

答えて

1

あなたのJSON応答で返された配列にアクセスする必要があるとして、あなたがする必要があります。$scope.Suppliers = response.data.tblSupplierMaster;

関連する問題