ネストされたJSONとAngularJS混乱

は基本的に私は、このJSONで結果PHPの準APIがあります。ネストされたJSONとAngularJS混乱

var prog=[]; 
var res=response.data; 

for(var i=0; i<=res['nm'];i++){ 


    prog.push(res[i]); 

} 

vm.events = prog;

I：

{"0":{"id":"325","course":"{\"0\":{\"id\":\"31\",\"title\":\"Ticket Seller  II\",\"code\":\"STN\"},\"nm\":1}","batch":"29","start_date":"2016-04-20 08:30:00","end_date":"2016-05-17 17:00:00"}}

をしかし、私はJSスクリプトによる最初のJSON配列を取得しながら、入れ子にされたJSON、 "コース"をどのように取得するか分かりません。私はこの角度スクリプトを持っています：

ng-repeat="event in table1.events"

しかし、event.course [0] .titleのようなエラーが出ます。繰り返しのネストなど

<span ng-repeat="title in event.course">

まだ動作しません。どのように取得するのですか？

私は次のことを試してみた：

<tr ng-repeat="event in table1.events"> 
    <td>{{ event.course }}<pre ng-repeat="value in event.course">{{ value.title }} 5664</pre> </td> 
</tr>

そして、それは動作しません。 5664は表示されませんが、event.courseはJSONスニペットを表示します。これは、スニペットがJSONとして読み込まれていないかのようです。

更新：申し訳ありませんが、現在動作しています。最初の数行に空のコンテンツが本当にあったので、私は解決策の作業を見ていませんでしたが、今すぐ動作します。

出典

2017-02-14 Patrick Silva

何かが 'json'と一緒に間違っています。 – Korte

私はスニペットを閉じなかった。スニペットはテーブル内のすべての行をリストする長いJSONであるため、コピーして貼り付けました。 –

ng-repeatをネストして使用することができます。下記のコードをご覧ください。

<!DOCTYPE html> 
 
<html ng-app="plunker"> 
 

 
<head> 
 
    <script data-require="[email protected]" src="https://code.angularjs.org/1.4.12/angular.js" data-semver="1.4.9"></script> 
 
</head> 
 

 
<body ng-controller="MainCtrl"> 
 
    <span ng-repeat="item in events"> 
 
    <span ng-repeat="value in item.course"> 
 
     <!-- if you want to get title alone --> 
 
     <pre>{{value.title}}</pre> 
 
    </span> 
 
    </span> 
 
</body> 
 
<script> 
 
    var app = angular.module('plunker', []); 
 
    app.controller('MainCtrl', function($scope) { 
 
    $scope.events = { 
 
     "0": { 
 
     "id": "325", 
 
     "course": { 
 
      "0": { 
 
      "id ": "31", 
 
      "title": "Ticket Seller II", 
 
      "code": "STN " 
 
      }, 
 
      "nm ": "1" 
 
     }, 
 
     "batch": "29", 
 
     "start_date": "2016-04-20 08:30:00", 
 
     "end_date": "2016-05-17 17:00:00" 
 
     }, 
 

 
     "1": { 
 
     "id": "325", 
 
     "course": { 
 
      "0": { 
 
      "id ": "31", 
 
      "title": "card Seller II", 
 
      "code": "STN " 
 
      }, 
 
      "nm ": "1" 
 
     }, 
 
     "batch": "29", 
 
     "start_date": "2016-04-20 08:30:00", 
 
     "end_date": "2016-05-17 17:00:00" 
 
     } 
 

 

 
    } 
 
    }); 
 
</script> 
 

 
</html>

コードもスパンのために働いている参照してください。

<!DOCTYPE html> 
 
<html ng-app="plunker"> 
 

 
<head> 
 
    <script data-require="[email protected]" src="https://code.angularjs.org/1.4.12/angular.js" data-semver="1.4.9"></script> 
 
</head> 
 

 
<body ng-controller="MainCtrl"> 
 
    <span ng-repeat="item in events"> 
 
    <span ng-repeat="value in item.course"> 
 
     <!-- if you want to get title alone --> 
 
     <span>{{value.title}}</br></span> 
 
    </span> 
 
    </span> 
 
</body> 
 
<script> 
 
    var app = angular.module('plunker', []); 
 
    app.controller('MainCtrl', function($scope) { 
 
    $scope.events = { 
 
     "0": { 
 
     "id": "325", 
 
     "course": { 
 
      "0": { 
 
      "id ": "31", 
 
      "title": "Ticket Seller II", 
 
      "code": "STN " 
 
      }, 
 
      "nm ": "1" 
 
     }, 
 
     "batch": "29", 
 
     "start_date": "2016-04-20 08:30:00", 
 
     "end_date": "2016-05-17 17:00:00" 
 
     }, 
 

 
     "1": { 
 
     "id": "325", 
 
     "course": { 
 
      "0": { 
 
      "id ": "31", 
 
      "title": "card Seller II", 
 
      "code": "STN " 
 
      }, 
 
      "nm ": "1" 
 
     }, 
 
     "batch": "29", 
 
     "start_date": "2016-04-20 08:30:00", 
 
     "end_date": "2016-05-17 17:00:00" 
 
     } 
 

 

 
    } 
 
    }); 
 
</script> 
 

 
</html>

出典

2017-02-14 09:14:42

実際には何をしたのですか？私はプレの代わりにスパンを使用しました。しかし、私は再び試みます。 –

これは問題ではありません。このスニペットは 'pre'と' span'の両方で動作します –

event.course "> {{item.title}}で

あなたJSONは、あなたのJSONの有効性を確認するためにバリデータを使用して、最後に}

{ 
    "0":{ 
     "id":"325", 
     "course":"{\"0\":{\"id\":\"31\",\"title\":\"Ticket Seller  II\",\"code\":\"STN\"},\"nm\":1}", 
     "batch":"29", 
     "start_date":"2016-04-20 08:30:00", 
     "end_date":"2016-05-17 17:00:00" 
    } 
}

が不足しています。 https://jsonformatter.curiousconcept.com/

出典

2017-02-14 08:52:25

申し訳ありませんが、スニペットをコピーして貼り付けましたが、閉じた状態で長いJSONでした}。私は少なくともスニペットを閉じたはずです。問題は角度がありましたが。 –

ネストされたJSONとAngularJS混乱

答えて

関連する問題