Save previous state - angular ui-router

This is a code of a tutorial about ui router. I have a question about it.

I am trying to find a way to save the previous state for viewB in the code below. What I mean - you can see that route1 state has content only for viewA, viewB isn't there.

My question is - is it possible when I choose route1 state, the viewA to be updated with the template route1.viewA but the right not to be updated to be empty, but the previous content of the right box - route2.viewB or index.viewB to stay there depends on the previous state?

<!DOCTYPE html>
<html ng-app="myapp">
<head>
    <title>AngularJS: UI-Router Quick Start</title>
    <link href="http://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.3.1/css/bootstrap.min.css" rel="stylesheet">
 </head>
 <body class="container">
   <div class="navbar">
     <div class="navbar-inner">
       <a class="brand" ui-sref="index">Quick Start</a>
       <ul class="nav">
         <li><a ui-sref="index">Home</a></li>
         <li><a ui-sref="route1">Route 1</a></li>
         <li><a ui-sref="route2">Route 2</a></li>
       </ul>
     </div>
   </div>
   <div class="row">
     <div class="span6">
       <div class="well" ui-view="viewA"></div>        
     </div>
     <div class="span6">
       <div class="well" ui-view="viewB"></div>        
     </div>
   </div>
   <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.4/angular.min.js"></script>
   <script src="http://angular-ui.github.io/ui-router/release/angular-ui-router.js"></script>
   <script>
     var myapp = angular.module('myapp', ["ui.router"])
     myapp.config(function($stateProvider){
     $stateProvider
     .state('index', {
        url: "",
        views: {
            "viewA": {
                template: "index.viewA"
            },
            "viewB": {
                template: "index.viewB"
            }
        }
    })
    .state('route1', {
        url: "/route1",
        views: {
            "viewA": {
                template: "route1.viewA"
            }
        }
    })
    .state('route2', {
        url: "/route2",
        views: {
            "viewA": {
                template: "route2.viewA"
            },
            "viewB": {
                template: "route2.viewB"
            }
        }
    })
})
    </script>
  </body>
</html>

It could work during the transition from index to route1 if route1 is a child state of index. See this plunker.

But in the case you describe, the state route1 must be a parent of both the state index and route2 which is not possible (only one parent for a child).