Question

我的VisiteCtrl中有一个调用“getItems（）”的按钮：

<button type="button" ng-click="getItems();">Populate</button>

这是我的VisiteCtrl：

function VisiteCtrl($scope, visiteService) {
  $scope.items = [];

  $scope.getItems = function() {
    var promise = visiteService.getItems();

    promise.then(function(items) {
      $scope.items = items;
    });
  };
}

我的'visiteService'：

var module = angular.module('app', []);

module.service('visiteService', function($q) {
    this.getItems = function() {
        var deferred, result = [];
        deferred = $q.defer();
        var db = window.openDatabase('database', '1.0', 'database', 200000);

        db.transaction(function(tx) {
            tx.executeSql("CREATE TABLE IF NOT EXISTS todos(id integer primary key, item text, qty integer, type varchar(50))");
            /*tx.executeSql("DELETE FROM todos;");
            tx.executeSql("INSERT INTO todos(id, item, qty, type) VALUES (null, 'Oignon', 1, 'Course')");
            tx.executeSql("INSERT INTO todos(id, item, qty, type) VALUES (null, 'Viande', 2, 'Course')");
            tx.executeSql("INSERT INTO todos(id, item, qty, type) VALUES (null, 'Dormir', 1, 'Autre')");*/
            tx.executeSql("SELECT * FROM todos", [], function(tx, res) {

            for(var i = 0; i < res.rows.length; i++) {
                result.push({
                    id : res.rows.item(i).id, 
                    item : res.rows.item(i).item, 
                    qty : res.rows.item(i).qty, 
                    type : res.rows.item(i).type
                });
            }
            deferred.resolve(result);
        },
        function(tx, err) {
            console.log(err);
        });
    },
    function(err) {
        console.log(err);
    });

    return deferred.promise;
    }
});

首次点击我的按钮： - 调用该服务时没有错误 - “deferred.resolve（result）;”也叫 - 包含数据的结果（console.log显示包含的内容）。 - ...但是“promise.then（...）”从未打过电话。

在我第二次点击之后，现在调用除了“promise.then（...）”之外的相同内容。 $ scope.items包含我的结果（打印在我的页面中）。

我修改了我的Ctrl来测试一些东西：

function VisiteCtrl($scope, visiteService) {

  $scope.items = [];
  $scope.called = false;

  $scope.getItems = function() {
      if (!$scope.called) {
          $scope.called = true;
          alert("hip");

          var promise = visiteService.getItems();

          promise.then(function(items) {
            alert("hop");
            $scope.items = items;
          });
       }
  };
}

首先点击：我有“嘻哈” 第二次点击：我有“跳”

好像第二次点击解决de $ q。

我完全迷失了。你不知道吗？

提前感谢您的答案。

Answer 1

我不确定它可以帮到你（复制/粘贴可能是个错误）但是你的服务中有一个“错误功能”太多：

函数 this.getItems 之后不能有“，函数（错误）{}”。我认为它可能会导致返回的承诺出现问题。另外，如果出现错误，请考虑添加 deferred.reject（'theErrorYouWantToPass'）。

this.getItems = function() {
    var deferred, result = [];
    deferred = $q.defer();
    var db = window.openDatabase('database', '1.0', 'database', 200000);

    db.transaction(function(tx) {
        tx.executeSql("CREATE TABLE IF NOT EXISTS todos(id integer primary key, item text, qty integer, type varchar(50))");
        /*tx.executeSql("DELETE FROM todos;");
        tx.executeSql("INSERT INTO todos(id, item, qty, type) VALUES (null, 'Oignon', 1, 'Course')");
        tx.executeSql("INSERT INTO todos(id, item, qty, type) VALUES (null, 'Viande', 2, 'Course')");
        tx.executeSql("INSERT INTO todos(id, item, qty, type) VALUES (null, 'Dormir', 1, 'Autre')");*/
        tx.executeSql("SELECT * FROM todos", [], function(tx, res) {

        for(var i = 0; i < res.rows.length; i++) {
            result.push({
                id : res.rows.item(i).id, 
                item : res.rows.item(i).item, 
                qty : res.rows.item(i).qty, 
                type : res.rows.item(i).type
            });
        }
        deferred.resolve(result);
    },
    function(tx, err) {
        console.log(err);
        deferred.reject(err);
    });

    return deferred.promise;
}

Answer 2

谢谢大家的回答。现在它有效！

以下是修改过的VisiteService.js：

var module = angular.module('app', []);

module.service('visiteService', function($q, $rootScope) {

    this.getItems = function() {
        var deferred, result = [];
        deferred = $q.defer();
        var db = window.openDatabase('database', '1.0', 'database', 200000);

        db.transaction(function(tx)  {
            tx.executeSql("CREATE TABLE IF NOT EXISTS todos(id integer primary key, item text,     qty integer, type varchar(50))");
            /*tx.executeSql("DELETE FROM todos;");
            tx.executeSql("INSERT INTO todos(id, item, qty, type) VALUES (null, 'Oignon', 1,     'Course')");
            tx.executeSql("INSERT INTO todos(id, item, qty, type) VALUES (null, 'Viande', 2,     'Course')");
            tx.executeSql("INSERT INTO todos(id, item, qty, type) VALUES (null, 'Dormir', 1,     'Autre')");*/
            tx.executeSql("SELECT * FROM todos", [], function(tx, res) {
                for(var i = 0; i < res.rows.length; i++) {
                    result.push({
                        id : res.rows.item(i).id, 
                        item : res.rows.item(i).item, 
                        qty : res.rows.item(i).qty, 
                        type : res.rows.item(i).type
                    });
                }
                deferred.resolve(result);
                $rootScope.$apply()
            },
            function(tx, err) {
                console.log(err);
            });
        });
        return deferred.promise;
    }
});

Answer 3

 Calling $q.when takes a promise or any other type, if it is not a promise then it will
 wrap it in a   promise and call resolve. If you pass a value to it then it is never
 going to be rejected.
 [http://plnkr.co/edit/tX29CPDMhQnYchOVPdfZ?p=preview][1]
Here is my plunker link check it

Angularjs：$ q的错误

3 个答案: