Available content in $ ionicLoading
I am trying to make a button clickable inside $ ionicLoading (template). I want to run the code if this button is clicked. Luckily ng-click doesn't work. Any work around? or I am making a fatal assumption. PS: I am new to angular and ionic
$ionicLoading.show({
template: '<ion-spinner></ion-spinner><br /><br /><p>Syncronising...</p>'
});
//stopSync function never fires
$scope.stopSync = function(){
$ionicLoading.hide();
}
//Shows the 'stop Sync' Button after two seconds
//for the user to fire the stopSync function
$timeout(function() {
$ionicLoading.show({
template: '<ion-spinner></ion-spinner><br /><br /><p>Syncronising...</p><button class="button button-clear" ng-click="stopSync()">Stop Sync</button>'
});
}, 2000);
+3
source to share
1 answer
I solved the problem thanks to http://atomx.io/2015/01/ionic-closing-ionicloading-if-your-app-loses-network-connectivity/
I had to add scope: $scope
as part of the parameters
$ionicLoading.show({
template: '<ion-spinner></ion-spinner><br /><br /><p>Syncronising...</p>'
});
$timeout(function() {
//$ionicLoading.hide();
$ionicLoading.show({
template: '<ion-spinner></ion-spinner><br /><br /><p>Syncronising...</p><button class="button button-clear" ng-click="stopSync()">Stop Sync</button>',
scope: $scope
});
}, 2000);
$scope.stopSync = function(){
$ionicLoading.hide();
};
+4
source to share