$ http Ottieni logica per consentire solo 200 OK

Question

Sto provando a creare una logica nella mia api in modo da escludere oggetti che hanno un URL nel campo "immagine" che restituisce un 4xx, 5xx, o timeout su 4000 ms .

Il codice seguente non funziona, in quanto consente ancora di visualizzare 404 e immagini vuote.

Qualcuno può suggerire come risolvere questo problema?

Inoltre, qui è in una plunker- http://plnkr.co/edit/7ScnGyy2eAmGwcJ7XZ2Z?p=preview

Esempio di JSON: {id: 242, immagine: "www.image.com/1.jpg", il nome: "bla bla"}

.controller('CardsCtrl', ['$scope', '$http', '$state', '$q', '$ionicLoading', '$ionicModal', 'TDCardDelegate', 'cardsApi', '$http', '$timeout', '$element', 
    function($scope, $http, $state, $q, $ionicLoading, $ionicModal, TDCardDelegate, cardsApi, $http, $timeout, $element) { 


    var loginuid = window.localStorage.getItem('uid'); 
    console.log(loginuid); 


    var MIN_CARDS = 7; 

    console.log('CARDS CTRL'); 
    $scope.cards = []; 

    cardsApi.getApiData() 
     .then(function(result) { 
     console.log(result.data); //Shows log of API incoming 
     $scope.cards = result.data; 

     result.data.forEach(function(card) { 
      var imgurl = card.image; 
      console.log(imgurl); 
      var canceler = $q.defer(); 
      $http.get(imgurl, { 
       timeout: canceler.promise 
      }) 
      .then(function mySuccess(response) { 
       console.log(response.status); 

      }, function myError(response) { 
       console.log(response.status); 

       if (response.status == 404) { 
       $scope.cards.splice(card, 1); 
       } 
       // console.log('deleted'); 
       var imgpid = "#card-image-" + card.vari; 
       console.log(imgpid); 
       $(imgpid).parent().remove(); 
      }) 
      .catch(function(err) { 

      }); 
      $timeout(function() { 
      $ionicLoading.hide(); 
      canceler.resolve(); 
      }, 4000); 
     }); 

     }) 

Answer 1

ho cambiato questa linea da:

<img class="storelogo-image" ng-src="{{card.store__logo}}"> 

a

<img class="storelogo-image" ng-src="{{card.store__logo.indexOf('http://')> -1 ?card.store__logo :''}}"> 

E funziona bene.

Answer 2

The plunker

ho aggiunto a <td-card ng-if="card.image" ng-repeat="card in cards" ...

Ciò impedirà il modello da generare e modello immagine vuota nel caso in cui non v'è alcuna immagine disponibile