Question

我正在使用Onsen-Ui开发应用程序。我使用Websql Database来存储一些列表并希望在页面中显示。但是在检索数据后，不显示。但是当我单击导航栏上的某个按钮时，将显示整个列表视图。这是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();。

您可以找到有关它的更多信息here

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

1 个答案: