angular ui-router with named nested views

<html>
  <head>
    <style>
      .red {
        background-color: red;
      }
      .green {
        background-color: green;
      }
      .blue {
        background-color: blue;
      }
    </style>
  </head>
  
  <body ng-app="app">
    <ui-view></ui-view>
    
    <script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.9/angular.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.4.2/angular-ui-router.js"></script>
   
    <script src="app.js"></script>
    
  </body> 
</html>

var myApp = angular.module('app', ['ui.router']);

myApp.config(function($stateProvider) {
  $stateProvider
    .state('index', {
        url: '',
        views: {
          
            '@': {
                templateUrl: 'body.html'
            },
            'blue-view@index': {
                templateUrl: 'view.html',
                controller: 'ViewController',
                controllerAs: 'viewCtrl',
                resolve: {
                  viewParams: function() {
                    return { color: 'blue' }
                  }
                }
            },
            'green-view@index': {
                templateUrl: 'view.html',
                controller: 'ViewController',
                controllerAs: 'viewCtrl',
                resolve: {
                  viewParams: function() {
                    return { color: 'green' }
                  }
                }
            },
            'red-view@index': {
                templateUrl: 'view.html',
                controller: 'ViewController',
                controllerAs: 'viewCtrl',
                resolve: {
                  viewParams: function() {
                    return { color: 'red' }
                  }
                }
            }
        }
    });
});

myApp.controller('ViewController', function($scope, viewParams) {
  $scope.color = viewParams.color;
});


<div ui-view="blue-view"></div>
<div ui-view="green-view"></div>
<div ui-view="red-view"></div>

<div ng-class="[color]">View</div>