jeudi 5 novembre 2015

Get data from sqLite into ONSEN template with AngularJS

I am trying to get data from my sqLite database and put into my phonegap app (with sqlite plugin) but there is no success. My code looks like:

module.controller('SpeakerController', function ($scope, $speaker) {
    $scope.items = $speaker.items;

    $scope.showSpeaker = function (index) {
        var selectedItem = $speaker.items[index];
        $speaker.selectedItem = selectedItem;
        $scope.navi.pushPage('speaker.html', {
            title: selectedItem.title
        });
    };
});

and this is how I am trying to get all data:

module.factory('$speaker', function () {
    db.transaction(function (tx) {
        tx.executeSql('SELECT title, label, desc FROM user_speakers', [], function (tx, results) {
            var data = {};
            alert('working');
            db.transaction(function (tx) {
                tx.executeSql(db, query, []).then(function (result) {
                    var rows = results.rows;
                    if (!rows.length) {
                        alert('No results found');
                    } else {
                        for (var index = 0; index < rows.length; index++) {
                            var i = rows.item(index);
                            data.items = [{
                                "title": i.title,
                                    "label": i.label,
                                    "desc": i.desc
                            }];

                        }
                    }
                }, function (error) {
                    console.error(error);
                });
                return data;
            });
        });
    });
});

and my template look like:

<ons-list ng-controller="SpeakerController">
                    <ons-list-item modifier="chevron" class="item" ng-repeat="item in items" ng-click="showSpeaker($index)">
                        <ons-row>
                            <ons-col width="60px">
                                <div class="item-thum"></div>
                            </ons-col>
                            <ons-col>
                                <header>
                                <span class="item-title">{{item.title}}</span>
                                <span class="item-label">{{item.label}}</span> 
                                </header>
                                <p class="item-desc">{{item.desc}}</p>
                            </ons-col>
                        </ons-row>
                    </ons-list-item>
                </ons-list>

I would really appreciate your help if you can check the code and let me know what I am doing wrong. Thank you.

Aucun commentaire:

Enregistrer un commentaire