AngularJS - 如何從圖像對象

Question

我試圖創建一個從簡單的圖像對象創建一個Deferred對象像下面創建遞延對象：

var image = new Image(); 
image.src = 'some url'; 
image.onload = function() { 
    // some code 
} 

！如何使用$ Q創建一個Deferred對象AngularJS中的庫？可能嗎？

Answer 1

我假設有一些工廠，你打算把這個功能放在哪裏。然後：

.factory('utils', function($q) { 
    return { 
     createImage: function(src) { 
      var deferred = $q.defer(), 
       image = new Image(); 
      image.onload = function() { 
       deferred.resolve(image); 
      }; 
      image.src = src; 
      return deferred.promise; 
     } 
    }; 
}); 

那麼你可以使用它像往常一樣：

utils.createImage('/assets/images/big-logo.png').then(function(imgObj) { 
    console.log(imgObj); 
}); 

角1.3。由於Angular 1.3版本承諾服務$q也允許類似於原生Promise構造函數的新語法。然後上面的功能可以重寫：

createImage: function(src) { 
    return $q(function(resolve, reject) { 
     var image = new Image(); 
     image.onload = function() { 
      resolve(image); 
     }; 
     image.src = src; 
    }); 
} 

您可以使用1.3版本。

最後簡單演示：http://plnkr.co/edit/MbQEDPHoAurFd6JwHTji?p=preview