When trying to add an ng-view inside an ng-include, nothing happens. e.g. in the following code, when themes/midnight/index.html holds an ng-view, no view is rendered:
<ng-include src="'themes/midnight/index.html'"></ng-include>
However, if I use the code below, the view shows twice:
<ng-include src="'themes/midnight/index.html'"></ng-include>
<div ng-view></div>
What is the problem and how can I resolve it?
This problem occurs due a delayed instantiation of ng-view (passing through ng-include). In such case the $route instantiation is delayed as well, and $route will miss the location change event (and routing will not be performed at all).
To bypass this, invoke the $route update function on application initialization:
yourApp.run(['$route', function($route) {
$route.reload();
}]);
Further more, it is sufficient to only include $route as a dependency. This will work, too:
yourApp.run(['$route', angular.noop]);
Source: the related issue on github.
Also check out ui-router, which is intended to specifically deal with the issue of nested views.
angular.module('Main', [dependencies here]) ?
template-srcin your routes? A bit more code would be appreciable :-).ng-viewis for use view$routeProvider.when(, {template-url: '...'});