AngularJS multiple routes with same template shouldn't rerender

1.1k views Asked by At

I have several views that use the same template, only the number of route params is different, how can I set it up so that the view doesn't get rerendered every time the route changes, tried with reloadOnSearch: false, but it didn't work for some reason.

app.config(['$routeProvider', function ($routeProvider) {
    $routeProvider
        .when('/feeds', {
            templateUrl: 'partials/feeds.html',
            controller: 'FeedsController'
        })
        .when('/feeds/:country', {
            templateUrl: 'partials/feeds.html',
            controller: 'FeedsController'
        })
        .when('/feeds/:country/:competition', {
            templateUrl: 'partials/feeds.html',
            controller: 'FeedsController'
        })
        .otherwise({
            redirectTo: '/feeds'
        });
}]);
1

There are 1 answers

1
lin On

According to the documentation, You cannot define multiple path's for one route. So in your case you should define two unique routes like:

app.config(['$routeProvider', function ($routeProvider) {
    $routeProvider
    .when('/feeds/:country/:competition/:event', {
        templateUrl: 'partials/event.html',
        controller: 'EventController'
    })
    .when('/feeds/:country/:competition', {
        templateUrl: 'partials/feeds.html',
        controller: 'FeedsController'
    })
    .otherwise({
        redirectTo: '/feeds'
    });
}]);

Difference, always call this URL with full params like:

http://yourapplication/feeds/false/false/false

http://yourapplication/feeds/1/false/false

http://yourapplication/feeds/1/2/false

http://yourapplication/feeds/1/2/3

And the one who is calling FeedsController is still unique with only two params:

http://yourapplication/feeds/1/2/