Hey All,
So I made a Toast service for showing messages in my Ionic App. It fires just fine when testing in the browser, but on the emulator or on a native device, it does not fire. I’ve also run the emulator debugger in safari, and the console has no errors. It just does nothing. Take a look at my code:
services.js:
.service('Toast', function($timeout, $rootScope) {
return {
success: function(toastMsg) {
if ($rootScope.toastShowing === false) {
console.log('toasting!');
$rootScope.toastShowing = true;
angular.element(document.querySelector('body')).append( "<div class='toast green animated fadeInUp'>" + "<span class='icon ion-checkmark-circled'></span>" + "<span class='toastmsg'>"+ toastMsg + "</span>" + "</div>" );
$timeout(function() {
angular.element(document.querySelector('.toast')).attr({class: "toast green animated fadeOutDown"});
$timeout(function() {
angular.element(document.querySelector('.toast')).remove();
$rootScope.toastShowing = false;
}, 400);
}, 3000);
}
},
And in my Homepage test controller:
I’m injecting ‘Toast’
.controller('HomeCtrl', function($scope, $rootScope, $ionicLoading, $timeout, $state, $ionicModal, Toast) {
And calling
Toast.success('test toast');
I’ve also tried wrapping it in a scope and calling it on a click
$scope.fireToast = function() {
Toast.success('test toast');
];
Again, works every time in the browser, just not on native emulator. Any ideas?