2017-09-01 8 views
0

親愛なる専門家を通じてウェブAPIからデータを取得する:私はAngularjsを使用してWeb APIからデータを取得しようとしています。しかし、私はエラーを得ました。私はGoogleのクロムを通じてAPIをテストして、それがJSON正しくはAngularjs

アプリの初回起動返します

var contractT = angular.module("ContractT",[]); 

第2の角度サービス:

contractT.service("crudService", function ($http) 
    { 
     this.getContracts = function() 
     { 
      return $http.get("/ContractTypesAPI/api/ContractTypes/getContracts"); 
     } 
    } 

) 

第3のコントローラ:

contractT.controller('crudController', function ($scope, crudService) 
{ 
    loadrecords(); 
    function loadrecords() 
    { 
     var promiseGet = crudService.getContracts(); //The MEthod Call from service 

     promiseGet.then(function (pl) { $scope.Contracts = pl.data }) 


    } 



}) 

四HTMLを:

<table border="1"> 
      <thead> 
       <tr>Code</tr> 
       <tr>Latin Description</tr> 
       <tr>Local Description</tr> 
      </thead>`enter code here` 
      <tbody> 
       <tr ng-repeat="c in Contracts"> 
        <td>{{c.Staff_Type_Code}}</td> 
        <td>{{c.L_Desc}}</td> 
        <td>{{c.A_Desc}}</td> 
       </tr> 
      </tbody> 
     </table> 

エラーは次のとおりです。リピータで 重複は許可されていません。固有のキーを指定するには、 'track by'式を使用します。リピータ:契約でC、重複キー:文字列:F、重複値:

JSON

"[{\"Staff_Type_Code\":1,\"L_Desc\":\"CONTINUOUS CONTRACT AND INSURED     \",\"A_Desc\":\"دائـــم ومـــؤمن عليـــه       \"},{\"Staff_Type_Code\":12,\"L_Desc\":\"CONTRACTING 36 HOURES        \",\"A_Desc\":\"متعــــاقد 36 ساعة        \"},{\"Staff_Type_Code\":13,\"L_Desc\":\"CONTRACTING 30 HOURES        \",\"A_Desc\":\"متعــــاقد 30 ساعة        \"},{\"Staff_Type_Code\":5,\"L_Desc\":\"ASSIGNED           \",\"A_Desc\":\"إنتـــداب           \"},{\"Staff_Type_Code\":14,\"L_Desc\":\"متعاقد 48ساعه          \",\"A_Desc\":\"متعاقد 48ساعه          \"},{\"Staff_Type_Code\":15,\"L_Desc\":\"متعاقد نصف الوقت         \",\"A_Desc\":\"متعاقد نصف الوقت         \"},{\"Staff_Type_Code\":16,\"L_Desc\":\"الطبيب المقيم          \",\"A_Desc\":\"الطبيب المقيم          \"},{\"Staff_Type_Code\":17,\"L_Desc\":\"دائم و مؤمن عليه/جامعة القاهرة     \",\"A_Desc\":\"CONTINUOS CONTRACT AND INSURED - CAIRO UNV.  \"},{\"Staff_Type_Code\":18,\"L_Desc\":\"CONTINUOUS CONTRACT AND INSURED WITHOUT INTENSIVE \",\"A_Desc\":\"دائم ومؤمن عليه بدون حافز       \"},{\"Staff_Type_Code\":19,\"L_Desc\":\"عقود/داخلى          \",\"A_Desc\":\"عقود/داخلى          \"},{\"Staff_Type_Code\":20,\"L_Desc\":\"عقود /جهاز مركزى         \",\"A_Desc\":\"عقود/جهاز مركزى         \"}]" 

fのザ・サイト上の例に答え

APIは、SQLデータベースからデータを取得している助けていません$インデックスによって すべてのヘルプ、事前のおかげで

答えて

0

使用トラック

<tr ng-repeat="c in Contracts track by $index"> 
    <td>{{c.Staff_Type_Code}}</td> 
    <td>{{c.L_Desc}}</td> 
    <td>{{c.A_Desc}}</td> 
</tr> 
+0

重複はフラグが立てられ、応答されません... –

+0

返信ありがとうございますが、HTMLページに空の小さな表のセルが返されます – Hassan

+0

@Hassanどういう意味ですか?あなたの質問 – Sajeetharan

0

ngのリピートは、一意のキーをループします。連絡先リストにユニークなキーがないため、そのエラーが発生しています。連絡先リストに一意のキーがない場合は、 "track by"インデックスオプションで角度ビルドを使用できます。

+0

Hassan

+0

ヘルプを使用した後、HTMLページに空の小さなテーブルセルを返します。私は "track by"インデックスを追加しましたが、それは空のデータを返す – Hassan

+0

私は問題を解決しなかったので、任意のヘルプ – Hassan