Question

I can't figure out what I'm doing wrong here. The last route defined isn't working:

    // Abstract route
    $stateProvider.state('main', {
        'abstract': true,
        url: '/main/',
        controller: 'mainController',
        templateUrl: '/app/views/main.html'
    });

    // This works using "#/main/program/"
    $stateProvider.state('main.program', {
        url: 'program/',
        controller: 'programController',
        templateUrl: '/app/views/main.program.html'
    });

    // This works using "#/main/program/details/123/"
    $stateProvider.state('main.program.details', {
        url: 'details/:programId/',
        controller: 'programDetailsController',
        templateUrl: '/app/views/main.program.details.html'
    });

    // This should work using "#/main/program/details/123/editor"
    // but just changes the url, doesn't load the view,
    // and the controller never executes!
    $stateProvider.state('main.program.details.editor', {
        url: 'editor/',
        controller: 'programDetailsEditorController',
        templateUrl: '/app/views/main.program.details.editor.html'
    });
Was it helpful?

Solution

Gah! Simple problem. I had <div ui-view></div> in the first two views, but had forgotten to add it to main.program.details.html. I hope this helps others with the same symptoms.

OTHER TIPS

Check for any errors in browsers console or looking for all loaded script files will give a clue. You may try using Batarang extension (May not be helpful for this scenario)

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top