0
jsonファイルから画像を表示しようとしています。これらの画像のURLはjsonファイルに保存されます。今は自分のコードを与えて、URLを印刷しているだけですが、パスの代わりにブラウザに実際のイメージを表示する方法が不思議です。見てコードの行は、ここで<td>{{article.cover_image_path}} </td>
angularJSを使用してjsonからフェッチしたフルパスURLを指定して画像を表示するにはどうすればよいですか?
これで私のhtmlです:
<html ng-app="myApp">
<head>
<meta charset="utf-8">
<title></title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js"></script>
<script>
var myApp = angular.module('myApp', []);
myApp.controller('myCtrl', function ($scope, $http){
$http.get('articles.json').success(function(data) {
$scope.articles= data;
});
});
</script>
</head>
<body ng-controller="myCtrl">
<table>
<tr>
<tr ng-repeat="article in articles">
<td>{{article.title}}</td>
<td>{{article.source}}</td>
<td>{{article.publish_time}}</td>
<td>{{article.cover_image_path}} </td>
</tr>
</table>
</body>
</html>
私のJSONファイルは、次のようになります。NG-srcのディレクティブでimgタグを追加することにより
試し '' – Claies
私の答えはあなたの質問を満たしている場合、pの値を持ちますリース受け付ける:) – WilomGfx
[AngularJS ng-src APIリファレンス](https://docs.angularjs.org/api/ng/directive/ngSrc)を参照してください。 – georgeawg