Content is Not Loading Properly

1

I have three url states namely,
/home, /products, /favorites
Each url have side menus attached to it and each has a tab also.

When i come to home and move to favorites tab, the content in favorites tab is displaying, But if i navigate after products, the favorites content pane is empty. It is getting loaded when i type in search box or adjusting the window of browser.
Please help me.

2

Can you post some code? Or even better, a codepen?

3

I have further Investigated the Problem and Found that the view is not getting updated only if the records are loaded from websql. I have used angular-websql module. And please find the code for controller and service.

.controller(‘FavoritesCtrl’, function($scope, $http ,$webSql ,InnomartService){
$scope.title = “Favorites List”;
InnomartService.getFavorites().then(function(favorites){
$scope.favorites = favorites;
});
console.log(“Called Fav”);
})

Service

getFavorites: function()
{
var deferred = $q.defer();
db = $webSql.openDatabase(‘innomart’, ‘1.0’, ‘innomart’, 2 * 1024 * 1024);
db.selectAll(‘fav’,function(results){
for(i=0;i<results.rows.length;i++)
{
items.push(results.rows.item(i));
console.log(results.rows.item(i));
}
});
deferred.resolve(items);
return deferred.promise;
}

4

Have Fixed the Issue,

The scope needs to be applied while pusing the element in the array.

5

Glad to hear you got it taken care of :smile:

6

I’m having the exact same issue. I’ve tried to apply the scope, but that doesn’t seem to work as it says it’s in the middle of a digest. Can you show the code that you used to apply the scope? My code is almost exact to what you have at the top.

Thanks!

7

Hi Jamie,

please find the below piece of code…

for(i=0;i<results.rows.length;i++)
{
	pid = results.rows.item(i).pid;
	nid = results.rows.item(i).nid;
	$http({cache: true, method: 'GET', url: 'testurl',params: {})
	.success(function(data){
	$scope.favorites.push(
	{
		"name" : data.title,
		"pid": data.product_id,
	});	
	});
	$scope.$apply();	
}
});

On Pusing each element you need to call $scope.apply()

8

So is that code in your service or your controller?

9

So I “figured” it out…still not sure why it works in Cordova/Angular without Ionic, but it does. What I needed to do in my service was

$rootScope.$apply(function(){
    deferred.resolve(row);
});

Thanks for the help.