Getting AngularJS ui router templates error

Question

I have the following routes:

    $stateProvider
    .state('access', {
        abstract: true,
        url: '/access',
        templateUrl: 'login.html'
    })
    .state('access.signin', {
        url: '/signin',
        templateUrl: 'tpls/signin.html',
        data: {
            authorizedRoles: [USER_ROLES.all]
        }
    });

$urlRouterProvider.otherwise('/access/signin');

Then my project looks something like this:

AS you can see I have a template called "login.html" this template looks like this:

<div class="logo">
    <a href="index.html">
        <img src="./assets/pages/img/logo-big.png" alt=""/> </a>
</div>
<!-- END LOGO -->
<!-- BEGIN LOGIN -->
<div class="content" ui-view>
</div>

However when I run this it loads the index.html as my template and doesn't use this login.html

What have I done wrong, and why might this be happening?

For template you don't need include js and css files. and also don't need ng-app and .... this template is similar to index.html file. see this sample and this sample — Hadi
– Hadi, Commented Aug 19, 2017 at 18:06
@Hadi what i am looking for is to change the layout completely. So that none of the html that is in index.html will be shown — Marc Rasmussen
– Marc Rasmussen, Commented Aug 19, 2017 at 18:14
You should use ui-view in index.html. Try checking the template path. — Hadi
– Hadi, Commented Aug 19, 2017 at 18:14

Hadi · Accepted Answer · 2017-08-19 18:30:37Z

1

As you ask in your question to have multiple layouts in your app, so for this you should use Multiple Named Views.

 $stateProvider     
 .state('report', {     
   views: {     
   'filters': { ... templates and/or controllers ... },     
   'tabledata': {},     
   'graph': {},     
  }     
})

For more information about it read it's document.

edited Aug 19, 2017 at 18:30

answered Aug 19, 2017 at 18:24

Hadi

17.3k4 gold badges41 silver badges63 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Getting AngularJS ui router templates error

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related