Using $state.go to navigate between views doesn't work, $location.path does

Correct, the main view is should be abstract and just be a shell which contains more sub-views. I too thought it was based on navigation at one point. Took me a few days to wrap my head around it.

Here’s a very crude example (you could make the content of sub-view 2 depend on what options are clicked/selected in subview 1):

//untested    
$stateProvider
    	.state('main-view', {
    		url: "/main",
    		abstract: true,
    		templateUrl: "templates/main.html"
    	})
    
    	.state('main.sub-view-1', {
    		url: '/sub-view-1',
    		templateUrl: 'templates/sub-view-1.html',
    		controller: 'Sub1Controller'
    	})
    
    	.state('main.sub-view-2', {
    		url: '/sub-view-2',
    		templateUrl: 'templates/sub-view-1.html',
    		controller: 'Sub2Controller'
    	});
4 Likes