AngularJS基於特徵的檢測

Question

在我的角度應用服務注入，我需要創建一個持久化服務接口調用基於在瀏覽器中可用的持久性機制的具體實施。我正在考慮使用通用存儲服務來實現這個功能，該存儲服務調用了能夠理解存儲機制的特定存儲服務。

例如，通用storageService將提供以下接口：

angular 
    .module('app.storage') 
    .factory('storageService', storageService); 

function storageService() { 
    return { 
     saveItem: saveItem, 
     getItem: getItem 
    } 

    ... 
} 

定於storageService，例如的多個實現localStorageService，indexedDbStorageService，webSqlStorageService。

根據瀏覽器功能動態注入具體存儲服務的最佳方式是什麼？例如，

if (isWebSqlAvailable()) { 
    // inject webSqlStorageService 
} 
else if (isIndexedDbAvailable() { 
    // inject indexedDbStorageService 
} 
else if (isLocalStorageAvailable() { 
    // inject localStorageService 
} 

Answer 1

angular 
    .module('app.storage') 
    .factory('storageService', ['$injector', storageService]); 

    function storageService($injector) { 

    var svc; 
    if (isWebSqlAvailable()) { 
    svc = $injector.get('webSqlService'); 
    } 
    else if (isIndexedDbAvailable() { 
    svc = $injector.get('indexedDbService'); 
    } 
    else if (isLocalStorageAvailable() { 
    svc = $injector.get('localStorageService'); 
    } 

    return svc; 
} 


angular 
    .module('app.storage').factory('webSqlService', webSqlService); 

function webSqlService(){ 
    return { 
     saveItem: saveItem, 
     getItem: getItem 
    } 

    function getItem(){ 

    } 

    function saveItem(){ 

    } 

} 

angular 
    .module('app.storage').factory('indexedDbService', indexedDbService); 

function indexedDbService(){ 
    return { 
     saveItem: saveItem, 
     getItem: getItem 
    } 

    function getItem(){ 

    } 

    function saveItem(){ 

    } 

} 

然後，你就只能以注入storageService無處不在，你想要的。