I have problem with following issue.
I have page with two tabs (tabs are template file).
If i tap on second tab is triggered method of the controller on the ng-init (SQL lite select). Page is displayed, code os exuceted, but nothing is shown as the content of the page (should be list).
If i tapped on tab second time, content is displayed (but background code is not executed again).
HTML CODE FROM TEMPLATE:
<ion-view title="Planned calls">
<ion-content class="padding" ng-controller="PlannedCallsCtrl" >
<!--WRITEOUT OVERAL STATS FOR DAYS -->
<div class="list" ng-init="getListOfPlannedCalls()">
<div class="item item-button-right" ng-repeat="plannedCallItem in plannedCalls">
{{plannedCallItem.contact_name}}
<button class="button button-positive">
<i class="icon ion-ios7-telephone"></i>
</button>
</div>
</div>
</ion-content>
</ion-view>
Controller method:
$scope.getListOfPlannedCalls = function() {
console.log('trying to get list of planned calls');
db = window.sqlitePlugin.openDatabase({name:"callplanner"});
db.transaction(function(tx) {
// init empty array for results
var plannedCalls = [];
tx.executeSql('SELECT * FROM planned_calls', [], function(tx,results){
for (var i=0; i < results.rows.length; i++){
row = results.rows.item(i);
plannedCalls.push(row);
console.log("row is " + JSON.stringify(row));
}
console.log("Planned calls contains:" + JSON.stringify(plannedCalls));
$scope.plannedCalls = plannedCalls;
});
});
};
TABS TEMPLATE:
<ion-tabs class="tabs-positive tabs-icon-top" animation="slide-left-right">
<!-- List of planned calls tab-->
<ion-tab title="List" icon="icon ion-home" href="#/tabplannedcalls/list" >
<ion-nav-view name="tab-planned-calls-list"></ion-nav-view>
</ion-tab>
<!--New planned call tab-->
<ion-tab title="New planned call" icon="icon ion-gear-b" href="#/tabplannedcalls/new">
<ion-nav-view name="tab-new-planned-call"></ion-nav-view>
</ion-tab>
</ion-tabs>
What can cause this issue and how i should to solve it?
Thanks for any advice.