Как реализовать несколько data-ng-view в AngularJS?

Подскажите, пожалуйста, как реализовать несколько data-ng-view.

Здесь показано, как вызывается первый шаблон.

 <div class="container-fluid" data-ng-app="contracts" data-ng-controller="contractsController">
<div class="col-xl-12" data-ng-view>
...


   <td><a data-ng-click="getInfoByContractID(<?php echo $value['idContract'];?>)" href="<?php echo $value['numberContract'];?>" class="numberContract"><?php echo $value['numberContract']; ?></a></td>

app.js

  var app = angular.module("contracts", ["ngRoute"]);
var appStage = angular.module("stage", ["ngRoute"]);

app.config(function($routeProvider, $locationProvider){
    $routeProvider
    .when("/:id", {
        templateUrl:"/views/cabinet/contracts-view.php"

    });
    $locationProvider.html5Mode(true);
});

appStage.config(function($routeProvider, $locationProvider){
    $routeProvider
    .when("/:id", {
        templateUrl:"/views/cabinet/stage-view.php"

    });
    $locationProvider.html5Mode(true);
});

В самом шаблоне (contracts-view.php) есть кнопка, которая должна открывать еще один шаблон

  <td><a data-ng-click="getInfoByStage({{stage.id_stage}})"  href="getStage/{{stage.id_stage}}"   
                                             class="btn btn-primary " role="button" aria-pressed="true">Подробнее</a></td>

Сейчас все работает. Первый шаблон появляется на страничке. Но если я добавляю вот это к первому куску кода, то ничего не работает.

        <div class="container-fluid" data-ng-app="stage" data-ng-controller="stageController">
                <div class="col-xl-12" data-ng-view>
                    <a href="#some_point"></a>

                    </div>
                </div>
                
                <!-- Begin Page Content -->
                <div class="container-fluid" data-ng-app="contracts" data-ng-controller="contractsController">

....