Angular 路线在单击时不起作用，但再次单击正在起作用答案

【问题标题】：Angular route is not working on single click but clicking again is workingAngular 路线在单击时不起作用，但再次单击正在起作用
【发布时间】：2016-05-26 01:29:35
【问题描述】：

我有一个数据服务，它将处理我所有的数据相关操作，所有这些操作都是异步的。

单击 ERASE 按钮后，有一个函数可以擦除所有数据并返回一个包含操作状态的对象（成功：真/假）。

基于这个值 (TRUE) 我需要路由到另一个视图（说数据已成功擦除页面）。

但是当我第一次点击按钮时，路由没有发生（但擦除功能给出了正确的值（真）。但是，如果我再次单击同一个按钮，则路线正在发生。

这里是我如何使用我的 removeDatabase()（dataService 的一部分）函数。

    self.removeDatabase = function () {
        //$location.path("/setup");
        dataService.resetDatabase().done(function (msgs) {
            if(msgs['Operation_success']){
                console.log("Operation is Success ? :"+msgs['Operation_success']);
                $location.path("/setup");
                //self.loadSetup();
            }
        });
    },

这是服务内部的函数。

appdata.resetDatabase = function () {
        appdata.msgs = {};
        var deferred = jQuery.Deferred();
        appdata.db = window.openDatabase("finbud_db", "1.0", "FinBud", 20);

        var d1 = jQuery.Deferred();
        appdata.db.transaction(function (tx) {
            tx.executeSql('DROP TABLE IF EXISTS BASE_TABLE');
        }, function () {
            appdata.msgs['BASE_TABLE'] = "Could not Delete";
            appdata.msgs['Operation_success'] = false;
            d1.resolve();
        }, function () {
            appdata.msgs['BASE_TABLE'] = "Deleted";
            appdata.msgs['Operation_success'] = true;
            d1.resolve();
        });

        var d2 = jQuery.Deferred();
        appdata.db.transaction(function (tx) {
            tx.executeSql('DROP TABLE IF EXISTS CATEGORY_TABLE');
        }, function () {
            appdata.msgs['CATEGORY_TABLE'] = "Could not Delete";
            appdata.msgs['Operation_success'] = false;
            d2.resolve();
        }, function () {
            appdata.msgs['CATEGORY_TABLE'] = "Deleted";
            appdata.msgs['Operation_success'] = true;
            d2.resolve();
        });

        var d3 = jQuery.Deferred();
        appdata.db.transaction(function (tx) {
            tx.executeSql('DROP TABLE IF EXISTS ACCOUNTS_TABLE');
        }, function () {
            appdata.msgs['ACCOUNTS_TABLE'] = "Could not Delete";
            appdata.msgs['Operation_success'] = false;
            d3.resolve();
        }, function () {
            appdata.msgs['ACCOUNTS_TABLE'] = "Deleted";
            appdata.msgs['Operation_success'] = true;
            d3.resolve();
        });

        var d4 = jQuery.Deferred();
        appdata.db.transaction(function (tx) {
            tx.executeSql('DROP TABLE IF EXISTS TRANSACTIONS_TABLE');
        }, function () {
            appdata.msgs['TRANSACTIONS_TABLE'] = "Could not Delete";
            appdata.msgs['Operation_success'] = false;
            d4.resolve();
        }, function () {
            appdata.msgs['TRANSACTIONS_TABLE'] = "Deleted";
            appdata.msgs['Operation_success'] = true;
            d4.resolve();
        });

        jQuery.when(d1, d2, d3, d4).done(function () {
            deferred.resolve(appdata.msgs);
        });
        return deferred.promise();

    };

最后的 HTML 是：

    <md-button  ng-click="appCtrl.removeDatabase();">
        <i class="mdi mdi-reload"></i> Reset App 
    </md-button>

任何帮助表示赞赏。谢谢你

【问题讨论】：

标签： javascript angularjs asynchronous routing ngroute

【解决方案1】：

您必须致电$scope.$digest() 来通知 Angular 发生了一些变化。我建议使用 $q promise 库中内置的 angular 而不是 jquery promises：

var d1 = $q.defer();
...
d1.resolve();
...
return $q.all([d1, d2, d3, d4]).then(function () {
    return appdata.msgs;
});

【讨论】：

您好，感谢您的回答。它解决了我的问题。但在 Success 函数中，我没有得到承诺的数据。
感谢您的快速回复。如果我控制台 "dataService.resetDatabase()" ，我得到承诺对象。（当然它有 $$state.value ）。但我正在尝试“dataService.resetDatabase().then(function(data){});”大大地。在这种情况下，我仍然感到空虚。我错过了什么？
@ManiKumarAkasapu 在控制台中调试appdata.msgs
每个功能都可以使用。但不是在 return().then()
我发布了解决方案，假设它会帮助某人。

【解决方案2】：

karaxuna 提供的答案是正确的。这是答案的扩展。

如果我喜欢下面，这将返回所有 4 个承诺。所需数据是 appdata.msgs，它位于每个 promise 内部（在 d.$$state 内部）。

var d1 = $q.defer();
...
d1.resolve();
...
return $q.all([d1, d2, d3, d4]).then(function () {
    return appdata.msgs;
});

默认情况下，所有函数都将返回延迟对象。但我想明确返回 appdata.msgs。所以现在我需要 4 个函数来返回数据而不是延迟。

为了实现这一点，我在四个函数中的每一个函数中都使用 appdata.msgs 来解决承诺（最后也返回相同的值）。

现在 all() 函数将在所有这些函数解析后返回 appdata.msgs（记得我用 appdata.msgs 解析）。

代码如下：

 function d1() {
   
   var d1 = $q.defer();
   
   ......
   //some where
   d1.resolve(msgs);
   .......
   
   return d1.promise;
}

................

 function dN() {
   
   var dN = $q.defer();
   
   ......
   //some where
   dN.resolve(msgs);
   .......
   
   return dN.promise;
}

return $q.all([d1(), d2(),  ....., dN()]).then(
  
         function () {
  
            return msgs;
  
         },
               
         function(){
  
            msgs['Operation_success'] = false;
            return msgs;
  
         });

如果我的理解有误，请纠正我。谢谢。

【讨论】：