0

I am new to AngularJS.

What I tried?

In angular, Now I am using 'ngRoute' for routing, when clicking a url, it loads a related template and its controller. So that template is loading before getting data (response from ajax call which was placed on controller).

In app.js :

            when('/categories', {
                title: 'Categories',
                templateUrl: 'templates/categories.html',
                controller: 'categoriesCtrl'
            })

            .when('category/listings_url', {
                title: 'Listings',
                cache: false,
                templateUrl: 'templates/listings.html',
                controller: 'listingsCtrl'
            })

In category.js :

app.controller('categoriesCtrl', function ($scope, $http, $rootScope, $location) {
$scope.categories = {};
$http.get('......./api/categories').then(function (response) {
    $scope.categories = response.data.categories;
});
  });

app.controller('listingsCtrl', function ($scope, $http, $rootScope, $location) {
$scope.listings = {};
$http.post('......./api/listings/',{category_url: category_url},{
    $scope.listings = response.data.listings;
});
});

What I exactly need means?

I need to change the current page (categories template, data) view after request, receiving response from the API call(template, data) until need to older page.

During listings page API call, just dull the background of category page, shows a page loader gif image on the category page.

Thanks in advance.

Lotus91
  • 1,127
  • 4
  • 18
  • 31
Chandran G
  • 51
  • 5
  • use $stateProvider and create a new route and change the route @ runtime.. refer http://angular-ui.github.io/ui-router/site/#/api/ui.router.state.$state – Binson Eldhose Apr 27 '16 at 10:17
  • Possible duplicate of [How to watch for a route change in AngularJS](http://stackoverflow.com/questions/14765719/how-to-watch-for-a-route-change-in-angularjs) – Nathan Apr 27 '16 at 11:40
  • Might be an idea to use route promises to help achieve this: If you chain your category promise to your listings promise, then the route won't display until both requests have completed. http://blog.brunoscopelliti.com/show-route-only-after-all-promises-are-resolved/ – Nathan Apr 27 '16 at 12:05

0 Answers0