AngularJS UI Router nested states are not working

Question

I am trying to have nested states in UI-Router. But with no luck. I keep getting the following error.

Uncaught Error: [$injector:modulerr] Failed to instantiate module AdminPortal due to:
Error: Cannot combine: component|bindings|componentProvider with: templateProvider|templateUrl|template|notify|async|controller|controllerProvider|controllerAs|resolveAs in stateview: '[email protected]'

This is my route, when I go to the :

$stateProvider
        .state('auth.portal', {
            templateUrl: '/admin/dist/templates/portal.tpl.html'
        })
        .state('auth.portal.dashboard', {
            url: '/dashboard',
            component: 'dashboardComponent',
            templateUrl: '/admin/dist/templates/dashboard.tpl.html'
        });

portal.tpl.html

<h1>Portal</h1>
<ui-view></ui-view>

Basicaly I want to load portal.tpl.html and use the ui-view in that document for the dashboard.tpl.html.

I already checked out the GitHub Docs, this Plunkr and some other questions on Stack Overflow, but still not working.

As I can see error clearly stated that. you should remove templateUrl property from state definition which makes more sense to me.. as component will take care of URL — Pankaj Parkar
– Pankaj Parkar, Commented May 6, 2017 at 19:51

Kumar Nitesh · Accepted Answer · 2017-05-06 19:51:19Z

2

It seems you don't need to specify tempale in your State router as you are using components now. Components should have the template definitions. Here is the link for more info https://ui-router.github.io/guide/ng1/route-to-component

answered May 6, 2017 at 19:51

Kumar Nitesh

1,65215 silver badges19 bronze badges

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

1 Comment

Marc Over a year ago

I thought it didn't matter where I defined that, because usualy I have the exact same templateUrl in the component as you suggest. But apperantly when I define it in the component it works! Thank you!

Collectives™ on Stack Overflow

AngularJS UI Router nested states are not working

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related