ionic 2 SQLite 使用 Promise 管理回调

ionic 2 SQLite manage callback with Promise

我想用Ionic 2获取SQLite交易成功的回调,目前还在学习HTML5Promise,还是有点迷茫。由于我之前大量使用 jQuery Deferred,因此我尝试调整我过去使用 jQuery.

所做的事情

在 Ionic 2 之前,我使用以下 jQuery 模式来执行我的异步 SQL:

var SqlResult = function(sqlToExecute,bracketValues){
    this.sqlToExecute = sqlToExecute;
    this.bracketValues =bracketValues;
};

SqlResult.prototype.execSqlCustomDeferred = function(){
        var execSqlCustomDeferredRes = $.Deferred();
        var execSqlCustomDeferredResProm = execSqlCustomDeferredRes.promise();  

        var sqlToExecuteForTx = this.sqlToExecute;
        var bracketValuesForTx = this.bracketValues;

        DbManagement.db.transaction(function(tx){
            tx.executeSql(sqlToExecuteForTx,bracketValuesForTx,success,error);
            function success(tx,rs){
                    execSqlCustomDeferredRes.resolve(rs);
            }
            function error(tx,error){
                execSqlCustomDeferredRes.reject(error);
            }
        });
        return execSqlCustomDeferredResProm;
};

使用该模式,我得到了异步结果,SqlResult.prototype.execSqlCustomDeferred.done(function(res){...})

现在我很难弄清楚应该如何排序才能使用 Promise 模式,我想到了以下但它不匹配:

这种情况不可行,因为 resolve()reject() 不存在(它不转译)。

private execSqlCustom = (sqlToExecute:string,bracketValues:Array<any>) => {
    let sqlToExecuteForTx:string = sqlToExecute;
    let bracketValueForTx:Array<any> = bracketValues;

    return this.db.transaction(
        function(tx){
            tx.executeSql(sqlToExecuteForTx,bracketValueForTx,success,error);
            function success(tx,rs){
                resolve(rs);                    
            }
            function error(tx,error){
                console.log('execSqlCustom error ' + error.message);
                reject(error);
            }
        }
    );

这也行不通,因为我认为我会丢失上下文 (this)(它会转换但在执行时它告诉我:

it cannot read db of undefined

):

private execSqlCustom = (sqlToExecute:string,bracketValues:Array<any>) => {
    let sqlToExecuteForTx:string = sqlToExecute;
    let bracketValueForTx:Array<any> = bracketValues;
    return new Promise(function(resolve,reject){
       this.db.transaction(
        function(tx){
            tx.executeSql(sqlToExecuteForTx,bracketValueForTx,resolve,reject);
        }
    );

有人发现我做错了什么吗?

我发现可以在函数末尾添加一个 .bind(this) 以在该函数内携带现有上下文 (this)。

通过创建一个 new Promise() 并在其中 function(resolve,reject){} 的末尾添加 .bind(this),它起作用了,我可以在返回的异步结果上使用 .then( (...) => {...}

我的函数看起来像这样:

private execSqlCustom = (sqlToExecute:string,bracketValues:Array<any>):Promise<any> => {

    return new Promise(function(resolve,reject){
        this.db.transaction(
        function(tx){
            tx.executeSql(sqlToExecute,bracketValues,success,error);
            function success(tx,rs){
                resolve(rs);                    
            }
            function error(tx,error){
                console.log('execSqlCustom error ' + error.message);
                reject(error);
            }
        }
        )}.bind(this)
    );
}