CODEWITHSUNDEEP
javascriptruby-on-rails-3angularjs
Aamir Shah
Aamir Shah

Reputation: 4493

How to load a different layout in angularjs

I have 2 layout files. Layout-1 Layout-2

The route /one is the starting point which loads the Layout-1, but now if I click on a link /two it gets me the file, but with Layout-1, instead i want, if i hit /two, Layout-2 should be loaded.

If i refresh the page, i get the correct thing coz that time i hit the server directly. So is there any way from angular to specify which layout file to load from Server.

Thanks.

Upvotes: 11

Views: 14920

Answers (3)

McLosys Creative
McLosys Creative

Reputation: 759

Loading new layout template means loading new html embedded with new javascript and css files. This is equal to redirecting page to new location. You can use $window.location.href="new/layout/template". Read angularjs developer guide for more info.

Upvotes: 1

Aamir Shah
Aamir Shah

Reputation: 4493

Finally, i got the problem solved using UI-Router

Thanks for the help :)

Upvotes: 0

SET001
SET001

Reputation: 11718

If it stands for client side routing then you should use $routeProvider to write a route for this

var app = angular.module('app', []);

app.config(function($routeProvider){
  $routeProvider
    .when('/one', {templateUrl: 'tmpl1.html'})
    .when('/two', {templateUrl: 'tmpl2.html'})
    .otherwise({redirectTo: '/one'});
});

It will allow you to define separate template and controller for another url/action

Here I made a working example of how it work.

If it is about serverside routing then read manual and use it like this:

match 'two' => 'controller#action'

Upvotes: 0

Related Questions