gpt4 book ai didi

javascript - AngularJS - 从 openDatabase 获取数据

转载 作者:行者123 更新时间:2023-11-28 07:25:59 25 4
gpt4 key购买 nike

我遇到了一个问题,我想从 openDatabase 获取数据并将其放入 ListView 中。有些线程说将 $scope.$apply(); 放在 $scope.items = $data; 之后,但出现错误:[$rootScope:inprog] $应用已经在进行中 发生。这是我的代码。

index.html

    <!doctype html>
<html lang="en" ng-app="app">

<head>
</head>
<body>
<ons-navigator var="navi">
<ons-page>
<ons-toolbar>
<div class="center">I Spent</div>
<div class="right" ng-controller="AddExpendController">
<ons-toolbar-button ng-click="">
<ons-icon icon="ion-plus" fixed-width="false" style="vertical-align: -4px;"></ons-icon>
</ons-toolbar-button>
</div>
</ons-toolbar>

<ons-list ng-controller="AppController">
<ons-list-item class="item" ng-repeat="item in items" ng-click="showDetail($index)">
<ons-row>
<ons-col width="60px">
<div class="item-thum"></div>
</ons-col>
<ons-col>
<header>
<span class="item-title">$ {{item.e_cost}}</span>
<span class="item-label">{{item.e_created}}</span>
</header>
<p class="item-desc">{{item.e_memo}}</p>
</ons-col>
</ons-row>
</ons-list-item>
</ons-list>
</ons-page>
</ons-navigator>
</body>
</html>

index.js

(function () {
'use strict';
var module = angular.module('app', ['onsen']);
var db = window.openDatabase("ispentdb", "1.0", "I Spending DB", 2000000);
module.factory('$data', function () {
var listItems = [];
db.transaction(function queryDB(tx) {
tx.executeSql('DROP TABLE IF EXISTS exptable');
tx.executeSql("Create Table IF NOT EXISTS exptable (eid INTEGER PRIMARY KEY, e_cost text, e_memo text, e_picture text, e_created text)");
tx.executeSql('INSERT INTO exptable (e_cost, e_memo, e_created) VALUES ("2.30","testing","2015-4-13")', []);
tx.executeSql('INSERT INTO exptable (e_cost, e_memo, e_created) VALUES ("2.32","testing","2015-4-12")', []);
tx.executeSql('select * from exptable order by eid DESC', [], function (tx, result) {
console.log("Returned rows = " + result.rows.length);
for (var i = 0; i < result.rows.length; i++) {
listItems.push({ e_cost: result.rows.item(i).e_cost, e_memo: result.rows.item(i).e_memo, e_created: result.rows.item(i).e_created });
}
});
});
console.log(listItems);
return listItems;
});

module.controller('AppController', function ($scope, $data) {
console.log($data);
$scope.items = $data;
});
})();

但是如果我使用这个方法就没有问题:

(function () {
'use strict';
var module = angular.module('app', ['onsen']);

module.controller('AppController', function ($scope) {
var db = window.openDatabase("ispentdb", "1.0", "I Spending DB", 2000000);
db.transaction(function (tx) {
//tx.executeSql('DROP TABLE IF EXISTS exptable');
tx.executeSql("Create Table IF NOT EXISTS exptable (eid INTEGER PRIMARY KEY, e_cost text, e_memo text, e_picture text, e_created text)");
//tx.executeSql('INSERT INTO exptable (e_cost, e_memo, e_created) VALUES ("2.30","testing","2015-4-13")', []);
//tx.executeSql('INSERT INTO exptable (e_cost, e_memo, e_created) VALUES ("2.32","testing","2015-4-12")', []);
}, errorDB, successDB)

function errorDB(err) {
alert("Error processing SQL: " + err)
}

function successDB() {
db.transaction(function queryDB(tx) {
tx.executeSql('select * from exptable order by eid DESC', [], function querySuccess(tx, result) {
var listItems = [];
console.log("Returned rows = " + result.rows.length);
for (var i = 0; i < result.rows.length; i++) {
listItems.push({ e_cost: result.rows.item(i).e_cost, e_memo: result.rows.item(i).e_memo, e_created: result.rows.item(i).e_created });
}
$scope.items = listItems;
$scope.$apply();
})
});
}
})
})();

最佳答案

您可以使用$scope.$evalAsync()而不是$scope.$apply()。它将触发摘要循环:

$scope.$evalAsync(function() {
// Update data here.
});

关于javascript - AngularJS - 从 openDatabase 获取数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29649800/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com