[英]Why can't my program find the images?
當我通過瀏覽器直接進入目錄時,即localhost:8888 / images / mansion-1.jpg,該圖像出現在瀏覽器上,但是在控制台上顯示為404,找不到該圖像。 有人可以協助我弄清楚為什么它無法檢索圖像嗎?
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>ng-mansions</title>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
</head>
<body ng-app="ngMansions" ng-controller="mansionsController">
<!--Nav Bar-->
<nav class="navbar navbar-default">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand" href="#">mc-mansions</a>
</div>
</div>
</nav>
<!--Real Estate Listings-->
<div class="container">
<div class="col-sm-4" ng-repeat="mansion in mansions">
<div class="thumbnail">
<img ng-src="images/{{mansion.image}}.jpg" alt="">
<div class="caption">
<h3>{{mansion.address}}</h3>
<p><strong>Type: </strong>{{mansion.type}}</p>
<p><strong>Description: </strong>{{mansion.description}}</p>
<p><strong>Price: </strong>{{mansion.price | currency}}</p>
</div>
</div>
</div>
</div>
</body>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.14.3/ui-bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.14.3/ui-bootstrap-tpls.min.js"></script>
<script src="app.js"></script>
<script src="scripts/mansionsController.js"></script>
<script src="scripts/mansionsFactory.js"></script>
</html>
也許你必須改變這個
{{mansion.image}}
至:
"+ {{mansion.image}} +"
由於顯示的是{{mansion.image}},因此實際的jpg文件也必須是單數的,即mansion-1.jpg而不是mansions-1.jpg。 這些細節真的讓我知道。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.