Question

我想要一个指令，将背景图像设置为特定图像（如果存在）或默认图像。

url从/images/cards/card{{$index}}.jpg采用ng-repeat形式，但实际上只存在部分图像。

这样做，但失败的$http请求被记录到我不想要的控制台（因为这段代码的重点是要知道某些图像不存在）。有什么建议？（似乎<img>标记有一个可以被捕获的错误事件，但我找不到证据background-image也有。

angular.module("stickers")
.directive('bkgDiv', function($http) {
    return {
        scope: {
            url: '@'
        },
        link: function(scope, elem, attrs) {
            // console.log("bkgDiv", scope.url);
            $http.get(scope.url)
            .success(function() {
                elem.css({backgroundImage: "url("+scope.url+")"});
            })
            .error(function() {
                elem.css({backgroundImage: "url(/images/animal.png)"});
            })
        }
    }
});

Answer 1

在你的控制器中，你将建立与图像网址相同级别的另一个字段，然后你要测试它的存在性，然后将结果存储在一个布尔值中（就JS而言布尔值）。这样您就可以在视图中绑定到这个新的布尔值。

偶然背景图像的角度指令

1 个答案: