CODEWITHSUNDEEP
angularjsangular-ui-routerangularjs-routing
pedrommuller
pedrommuller

Reputation: 16066

Blank page using multiple views with UI-Router

I followed this article and this other I've tried to replicate what's on the wiki, without any luck.

So far this is what I've done the folder structure:

stateProvider:

angular.module('app').config(function($stateProvider, $urlRouterProvider) {
        $stateProvider.state("index",
        {
            url: "/index",
            templateUrl:'/partial/index.html',
            views: {
                'footer@index': {
                    templateUrl: "/partial/header.html",
                    controller:"FooterCtrl"
                },
                'header@index': {
                    templateUrl: "/partial/header.html",
                    controller: "HeaderCtrl"
                }
            }
    });  
 $urlRouterProvider.otherwise('/index');

EDIT:

this is the markup:

<div>
    <div id="content" class="container">

        <div ui-view="header"></div>
        <div ui-view></div>
        <div ui-view="footer"></div>

    </div>
  </div>

the url I'm browsing is: localhost:9001/#/index

I don't get any error just a blank page

Upvotes: 6

Views: 3971

Answers (2)

oleg gabureac
oleg gabureac

Reputation: 853

don't left a slash at the end of the url

not working: http://sjhite.com/questions/23924587/

working: http://sijhte.com/questions/23924587

Upvotes: 0

Victor Soto
Victor Soto

Reputation: 234

Looks like you used incorrect paths on the templateUrl.

Here's the plunker using ui-router: http://plnkr.co/edit/Nqwlkq1vGh5VTBid4sMv?p=preview

I also suggest reading the source code of http://angular-ui.github.io/ui-router/sample/#/ it has an abstract implementation here and many comments on how to work with ui-router properly.

Upvotes: 2

Related Questions