2015-09-04 93 views
4

我已經創建了一個使用離子框架的移動應用程序。它包含許多圖像。我需要加載所有圖像而不閃爍。因此,我使用$ImageCacheFactory通過引用此blog來預加載所有圖像。

我用下面的code.The問題是,該應用程序包含100 png圖像,所以我必須參考所有的PNG文件。

.run(function($ImageCacheFactory) { 
    $ImageCacheFactory.Cache([ 
     "img/user.png", 
     "img/profile.png", 
     "img/logo.png", 
     "img/splash.png", 
     "img/map.png", 
     "img/shop.png", 
     "img/country.png", 
     "img/place.png" 
     ]).then(function(){ 
     console.log("Images done loading!"); 
     },function(failed){ 
      console.log("Error..!!!"); 
    }); 
}) 

是否有使用單線代碼闖民宅所有PNG圖像的任何簡便的方法(所有的圖像都在www/img文件夾).Thanks

回答

3

創建角度工廠如下

.factory("$fileFactory", function($q) { 

    var File = function() {}; 

    File.prototype = { 

    getEntries: function(path) { 
     var deferred = $q.defer(); 
     window.resolveLocalFileSystemURI(path, function(fileSystem) { 
     var directoryReader = fileSystem.createReader(); 
     directoryReader.readEntries(function(entries) { 
      deferred.resolve(entries); 
     }, function(error) { 
      deferred.reject(error); 
     }); 
     }, function(error) { 
     deferred.reject(error); 
     }); 
     return deferred.promise; 
    } 

    }; 

    return File; 

}); 

然後得到所有文件使用列表getEntries()

.run(function($ImageCacheFactory, $ionicPlatform, $fileFactory) { 
    var fs = new $fileFactory(); 
    $ionicPlatform.ready(function() { 
    fs.getEntries('img').then(function(result) { 
     var files = result; 
     files = files.unshift({ 
     name: "[parent]" 
     }).map(function(i, v) { 
     return 'img/' + v.name; 
     }); 
     $ImageCacheFactory.Cache(files).then(function() { 
     console.log("Images done loading!"); 
     }, function(failed) { 
     console.log("Error..!!!"); 
     }); 
    }) 
    }); 
}); 

你需要安裝依賴Apache Cordova File

cordova plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-file.git 

參考:Helpful tutorial

+1

感謝buddy.You節省了我的時間 – Muhsin

+0

這是否也獲得img目錄中的子文件夾? – lunacafu

0

我很抱歉我沒有正答案。但我知道爲什麼它不工作。

使用Web瀏覽器

不要這樣做。如果你甚至試圖在網絡瀏覽器中打開這個項目,你就會爲自己設置失敗。此應用程序使用Web瀏覽器不熟悉的本機設備插件。反過來,這會造成奇怪和錯誤。

+0

這可能是更好的評論問題,如果它不是一個答案 –