UI路由问题

Question

我在使用（多视图，UI路由）小部件明智的实现时遇到了一个问题。

第一页有一个链接即测试。当我们点击该链接时，将出现三个小部件（绿色，红色，蓝色）。每个小部件都有一个链接（例如：ADD A）。当我们点击该链接时，会出现另一个视图（例如：编辑a）。

我的问题是，当我们点击添加A链接时，会出现'编辑'视图，然后点击添加B链接，然后出现'编辑b'视图，但是'编辑'视图消失了。在这种情况下我想显示“编辑”和“编辑b”视图。

Code in plunker

<a  ui-sref="home">Test</a>

<div ui-view></div>
<div ui-view="chart"></div> 
<div ui-view="data"></div>     

JS代码：

var myapp = angular.module('myapp', ["ui.router"])
myapp.config(function($stateProvider){

     $stateProvider.state("home", {
        views: {
            "": {
                templateUrl: "a.html"
            },
            "chart": {
                templateUrl: "b.html"
            },
            "data": {
                templateUrl: "c.html"
            }
        }    
    })

     .state('home.Adda', {
      views: {

            "aAdd": {
                templateUrl: "a.a.html"
            }
        }   
    })

    .state('home.Addb', {
      views: {

            "bAdd": {
                templateUrl: "b.b.html"
            }
        }   
    })

    .state('home.Addc', {
      views: {

            "cAdd": {
                templateUrl: "c.c.html"
            }
        }   
    })
})