为什么我的程序找不到图像？

Question

当我通过浏览器直接进入目录时，即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>

Answer 1

也许你必须改变这个

{{mansion.image}}

至：

"+ {{mansion.image}} +"

Answer 2

由于显示的是{{mansion.image}}，因此实际的jpg文件也必须是单数的，即mansion-1.jpg而不是mansions-1.jpg。 这些细节真的让我知道。

为什么我的程序找不到图像？

问题描述

2 个解决方案

解决方案1
0 2015-10-28 18:31:20

解决方案2
0 已采纳 2015-10-28 19:01:13

为什么我的程序找不到图像？

问题描述

2 个解决方案

解决方案1 0 2015-10-28 18:31:20

解决方案2 0 已采纳 2015-10-28 19:01:13

解决方案1
0 2015-10-28 18:31:20

解决方案2
0 已采纳 2015-10-28 19:01:13