Apiから角を使用してデータを取得する

ここに私の最初の著者名を解析したいapiがあります。Apiから角を使用してデータを取得する

{ 
    status: "ok", 
    source: "the-next-web", 
    sortBy: "latest", 
    articles: - [ 
    { 
     author: "Napier Lopez", 
     title: "Microsoft reveals the first Cortana-powered Amazon Echo competitor", 
     description: "We first got wind of a Cortana-powered speaker was on the way back in December, but now it's finally here. Microsoft and Harmon Kardon today revealed the 'Invoke,' the first Amazon ...", 
     url: "https://thenextweb.com/microsoft/2017/05/08/microsoft-reveals-first-cortana-powered-amazon-echo-competitor/", 
     urlToImage: "https://cdn2.tnwcdn.com/wp-content/blogs.dir/1/files/2017/05/Harmon-Kardon-Invoke-Cortana-Speaker-Microsoft.jpg", 
     publishedAt: "2017-05-08T18:35:18Z" 
    }, 
    { 
     author: "Rachel Kaser", 
     title: "Facebook fights fake news in UK with newspaper ads and account purges", 
     description: "As the UK election draws near, Facebook is cleaning house. The social media giant is taking two major steps to combat false news at a critical moment: deleting accounts and buying ...", 
     url: "https://thenextweb.com/facebook/2017/05/08/facebook-fights-fake-news-uk-newspaper-ads-account-purges/", 
     urlToImage: "https://cdn2.tnwcdn.com/wp-content/blogs.dir/1/files/2017/04/Screen-Shot-2017-04-14-at-14.24.46.jpg", 
     publishedAt: "2017-05-08T18:03:29Z" 
    } 
    ] 
}

私はこの

{{content.author}}

によって、このすべての$ scope.content内のデータと第一著者名の取得を格納している。しかし、それは何も表示されません。どうして、どうやって修正するのか教えていただけますか？

出典

2017-05-08 Rinku Malik

上ngのリピートを行う必要があり、あなたは{{コンテンツ以外のスコープの他のparamsにアクセスすることができます。 author}} "content"プレフィックスを使用していますか？ – Basilf

あなたはcontent.articles

<tr ng-repeat="x in content.articles"> 
    <td>{{ x.author }}</td> 
    <td>{{ x.title }}</td> 
</tr>

DEMO

var app = angular.module("myApp", []); 
 
app.controller("PatientsController", function($scope) { 
 
$scope.content = { 
 
"status": "ok", 
 
"source": "the-next-web", 
 
"sortBy": "latest", 
 
"articles": [ 
 
{ 
 
"author": "Napier Lopez", 
 
"title": "Microsoft reveals the first Cortana-powered Amazon Echo competitor", 
 
"description": "We first got wind of a Cortana-powered speaker was on the way back in December, but now it's finally here. Microsoft and Harmon Kardon today revealed the 'Invoke,' the first Amazon ...", 
 
"url": "https://thenextweb.com/microsoft/2017/05/08/microsoft-reveals-first-cortana-powered-amazon-echo-competitor/", 
 
"urlToImage": "https://cdn2.tnwcdn.com/wp-content/blogs.dir/1/files/2017/05/Harmon-Kardon-Invoke-Cortana-Speaker-Microsoft.jpg", 
 
"publishedAt": "2017-05-08T18:35:18Z" 
 
}, 
 
{ 
 
"author": "Rachel Kaser", 
 
"title": "Facebook fights fake news in UK with newspaper ads and account purges", 
 
"description": "As the UK election draws near, Facebook is cleaning house. The social media giant is taking two major steps to combat false news at a critical moment: deleting accounts and buying ...", 
 
"url": "https://thenextweb.com/facebook/2017/05/08/facebook-fights-fake-news-uk-newspaper-ads-account-purges/", 
 
"urlToImage": "https://cdn2.tnwcdn.com/wp-content/blogs.dir/1/files/2017/04/Screen-Shot-2017-04-14-at-14.24.46.jpg", 
 
"publishedAt": "2017-05-08T18:03:29Z" 
 
} 
 
]}; 
 
});

<!DOCTYPE html> 
 
<html> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
 

 
<body ng-app="myApp" ng-controller="PatientsController"> 
 
<table> 
 
    <tr ng-repeat="x in content.articles"> 
 
    <td>{{ x.author }}</td> 
 
    <td>{{ x.title }}</td> 
 
    </tr> 
 
</table> 
 
</body> 
 
</html>

出典

2017-05-08 17:45:05 Sajeetharan

kk this thanx –

@RinkuMalikデモを確認 – Sajeetharan

@RinkuMalikマークが回答しました – Sajeetharan

Apiから角を使用してデータを取得する

答えて

関連する問題