Question

我正在使用MEAN堆栈开发一个Web应用程序，除了这个让我烦恼的持续错误之外，它已经完成了99％。我已将其部署到https://find-nightlife.herokuapp.com/#/

我的问题是，当您搜索某个位置时，Web控制台将始终抛出这些错误：

GET https://find-nightlife.herokuapp.com/%7B%7Bplace.rating_img_url%7D%7D 404 (Not Found)
 %7B%7Bplace.image_url%7D%7D:1 GET https://find-nightlife.herokuapp.com/%7B%7Bplace.image_url%7D%7D 404 (Not Found)

链接到github上的完整代码是https://github.com/JordanBourne/NightLife

相关代码：

<section class = "results">
<div ng-repeat = "place in results track by $index | limitTo: 10" class = "resultContainer">
    <div class = "resultsList">
        <div class = "placeImg"><img src = "{{place.image_url}}" alt = "{{place.name}}"/></div>
        <div class = "placeAbout">
            <div class = "placeName">
                <a href = "{{place.url}}">{{place.name}}</a> <img src = "{{place.rating_img_url}}" /></div>
            <div class = "placeSnippet">{{place.snippet_text}}</div>
        </div>
        <div class = "areyouGoing"><span style = "color: red">{{error}}</span> {{place.going}} Going 
            <button class = "placeGo notGo" ng-click = "plusOne(place, $index)" ng-show = "attend($index)">Not Going</button>
            <button class = "placeGo letsGo" ng-click = "plusOne(place, $index)" ng-hide = "attend($index)">Let's Go!</button>
        </div>
    </div>
    <div class = "divider" ng-hide="$last"></div>
</div>

app.controller('NightLifeCtrl', [
'$scope',
'yelp',
'auth',
function ($scope, yelp, auth) {
    if(yelp.places.data) {
        var attendanceIndex = [];

        yelp.bars.forEach(function(bar) {
            if (bar.people.indexOf(auth.currentUser()) < 0) {
               attendanceIndex.push(0);
            } else {
               attendanceIndex.push(1);
            }
        })

        $scope.attend = function (num) {
            if (attendanceIndex[num] == 1) {
                return true;
            } else {
                return false;
            }
        }

        $scope.results = yelp.bars;

        $scope.plusOne = function(place, num) {
            if (!auth.isLoggedIn()) {
                $scope.error = 'You must be logged in!';
                return;
            }

            yelp.addOne(place);

            if (attendanceIndex[num] == 1) {
                return attendanceIndex[num] -= 1;
            } else {
                return attendanceIndex[num] += 1;
            }
        }
    }
}
]);

所有angular.js都在public / js / scripts.js中，guilty ng-repeat位于public / nightlife.html，views / index.ejs中的主页

我感谢任何帮助！

Answer 1

在href属性中ng-href=""时始终使用{{<expressions>}}属性。

这将阻止大部分不必要的行为。

这里是documentation for ng-href.

来自文档的引用：

写错的方法：

<a href="http://www.gravatar.com/avatar/{{hash}}">link1</a>

写它的正确方法：

<a ng-href="http://www.gravatar.com/avatar/{{hash}}">link1</a>

Answer 2

将<img src = "{{ ..}}">替换为<img ng-src = "{{ ..}}">。 ng-src属性支持动态内容。

我的ng-repeat使用了错误的链接

2 个答案: