Question

我创建了一个简单的测试程序，它为数组中的每个数字取一个json结果。

app.controller('myController', function($scope, utils, $sce, $q)
{
    var numbers = [85 , 84, 85 ];
    var ctrl = this;
    var arr = [];
    var arr2 = [];
    angular.forEach(numbers, function(v, k)
    {
        arr.push(utils.getPosts('http://b1estvision.co.il/poligon/wp-json/wp/v2/media/' + (v)));
    });
    $q.all(arr).then(function(b)
    {
        angular.forEach(b, function(v, k)
        {
            arr2.push(v.data.source_url)
        })
        ctrl.pics = arr2;
    });
});

因此对于[85 , 84, 85 ]中的每个数字，我都会获取一个json，其中包含IMG网址。

使用$q.all我等待所有 jsons下载，然后我尝试读取网址的值并将其放入屏幕（ctrl.pics）通过ng-repeat。

效果很好：

但如果我修改这个数组：

  var numbers = [85 , 84, 85 ];

到

 var numbers = [85 , 0,85  ]; // second request will not be resolved because of "NOT FOUND".

- 它不会向我显示任何内容（因为被拒绝的请求）

目标：我想为被拒绝的请求设置默认图片（比如：http://dummyimage.com/130x40.png/09f/fff/&text=not%20found）

问题

如何修改我的代码，以便我可以为被拒绝的promise / s设置默认图像。

FULL PLUNKER

订单很重要！ html中的每个img都应该匹配数字数组的顺序

Answer 1

以下是您问题的可能解决方案：

app.controller('myController', function($scope, utils, $sce, $q) {
  var numbers = [85, 85, 0];
  var ctrl = this;
  ctrl.pics = [];

  angular.forEach(numbers, function(v, k) {
    utils.getPosts('http://bestvision.co.il/poligon/wp-json/wp/v2/media/' + (v)).then(
      function(v) { //success
        ctrl.pics[k] = v.data.source_url;
      },
      function() { //error
        ctrl.pics[k] = 'http://dummyimage.com/130x40.png/09f/fff/&text=not%20found';
      }
    );
  });


});

如果数组中的任何承诺失败，Q.all将失败，请参阅https://github.com/kriskowal/q/wiki/API-Reference：

<强> promise.all（）

返回一个使用包含每个承诺的履行价值的数组来履行的承诺，或者被拒绝的拒绝理由与第一个被拒绝的承诺相同。

Forked plunkr

Answer 2

您可以让getPost返回一个始终有默认数据的承诺：

     getPosts: function(address){
       return $q(function(resolve, reject) {
            $http({
              method: 'GET',
              url: address
            }).then(function successCallback(response) {
              resolve(response);
            }, function errorCallback(response) {
              resolve({
                data:{
                  "source_url": "http://icons.iconarchive.com/icons/mazenl77/I-like-buttons-3a/512/Cute-Ball-Go-icon.png"
                }
              });
            });
        });
      }

http://plnkr.co/edit/sGnFpJH8lZ4gnLI568OR?p=preview

处理被拒绝的ajax请求？

2 个答案: