使用Onsen-ui将数据库中的数据显示到Phonegap应用程序中

Question

我正在使用Onsen-Ui开发应用程序。 我使用Websql数据库存储一些列表，并希望显示在页面中。 但是，在检索数据后，不显示。 但是，当我单击导航栏上的某个按钮时，将显示整个列表视图。 这是js代码。

document.addEventListener("deviceready", onDeviceReady, false);

function onDeviceReady() {

    loadingViewOne.show();
    $scope.isEditing = false;
    $scope.myChecked = false;
    $scope.downloadedLists = [];
    this.store = new WebSqlStore(function() {
    });
    //alert('webstore start');
    this.store.retrieveAll(function(allPublications){
        //alert('webstore finished');
        $scope.downloadedLists = allPublications; // allPublications is data from DB
        $scope.$apply //------------------This is the answer...
        $scope.finishedRetrieving = true;
        loadingViewOne.hide();
        //appendListView(allPublications);
    });

}

这是HTML代码。

<ons-list ng-show="finishedRetrieving"><!-- List Item -->
<ons-list-item ng-repeat="rows in downloadedLists">
    <br><!--Space between Rows-->
    <ons-row>
        <ons-col width="33.33%" ng-repeat="list in rows"><!-- Column Grid Item-->

            <button class="button button--quiet" style="width: 100%" ng-click="downloadNav.pushPage('readingView.html', {issueNo: list})" ng-disabled="isEditing">
                <img src="services/pics/{{list.pic}}" width="100%" height = "100%" />
            </button>

            <p style="text-align: center; width: 95%;">{{list.firstName}}</p>
        </ons-col>

    </ons-row>
</ons-list-item>

提前致谢...

Answer 1

尝试使用$scope.$apply(); ，它会更新出价。

你可以在这里找到更多关于它的信息