angular-js 2 or 3 ng-view for slide - angularjs

Question

i need to add 2 o 3 slider to my page with angularjs by reading some json.
my code should be something like that:
<div class="wrapper">
<div id="navigation">...</div>
<div class="slider">
<ul class="painting">
<li>
<img src="img/01.jpg" height="240" width="237"/>
<h1>title</h1>
<h2>description</h2>
</li>
<li>...</li>
<li>...</li>
</ul>
</div>
<div class="slider">
<ul class="illustration">
<li>
<img src="img/01.jpg" height="240" width="237"/>
<h1>title</h1>
<h2>description</h2>
</li>
<li>...</li>
<li>...</li>
</ul>
</div>
<div class="footer"></div>
</div>
i code 2 template: one for the list of slide and one for the detail. I add ng-view to the first div.slider and when i click on the image, the details template is open inside the div.slider ..instead i need to clean all and print it inside the body.
By now, this is my index:
<div id="wrapper">
<div id="navigation">...</div>
<div id="portfolio" class="sliderCont first">
<div ng-view class="slider"></div>
</div>
<div class="sliderCont">
<div class="slider"></div>
</div>
<div class="sliderCont">
<div class="slider"></div>
</div>
<div class="sliderCont last">
<div class="slider"></div>
</div>
</div>
this is my list.html template:
<ul class="works">
<li ng-repeat="work in works">
<img src="{{work.thumbUrl}}" height="240" width="237"/>
<h1>{{work.testo1}}</h1>
<h2>{{work.testo2}}</h2>
</li>
</ul>
my controller.js:
function sliderListCtrl($scope, $http) {
$http.get('json/slider1.json').success(function(data) {
$scope.works = data;
});
}
function sliderDetailCtrl($scope, $routeParams, $http) {
$http.get('json/' + $routeParams.workId + '.json').success(function(data) {
$scope.work = data;
});
}
and in the end, my app.js:
angular.module('workList', []).
config(['$routeProvider', function($routeProvider) {
$routeProvider.
when('/works', {templateUrl: 'partials/work-list.html', controller: sliderListCtrl}).
when('/works/:workId', {templateUrl: 'partials/work-detail.html', controller: sliderDetailCtrl}).
otherwise({redirectTo: '/works'});
}]);
does anyone have any idea?

Answer 1

I am not sure if I understand your question, but reading the title, 2-3 ng-view, that is not possible.
You can only have one ng-view per application, which normally contains the application itself.
If you want to add partial templates, you can use ng-include which allow you to add all the templates you want inside others.
On the other hand, there is a ui-router project which have a different way to add templates to your views.