Regex AngularJS Ui路由器正则表达式将通配符匹配到模板和控制器

我有一个单页angularjs应用程序，使用嵌套的命名视图和ui路由器，它正在工作，但在定义状态时有很多重复的代码，但我不确定解决问题的最佳方法。在下面的状态声明中，我必须重复所有视图，其中唯一的更改是“页面视图”中模板和控制器的名称。“登录状态视图”、“站点状态视图”、“调试视图”都保持不变。我想删除这个重复，只定义规则的例外

我尝试过正则表达式，但我无法让它工作，我读过[question]：这可能是一个选项，可以运行公共页面列表并定义每个状态。在我继续之前，我想确定我是以“正确”的方式接近这一点的。使用正则表达式以及如何使用，或者通过循环定义状态，或者其他我缺少的东西

页面html：

<!--Simplified html: named ui-views defined-->
<div data-ng-controller="mainCtrl as vm">
    <div class="container body-content">
        <div ui-view="login-status-view"></div>
        <div ui-view="site-status-view"></div>
        <div ui-view="page-view"></div>
        <div ui-view="debug-view"></div>
    </div>
</div>

---

使所有公共视图处于抽象父状态

将看起来像这样，页面视图模板是子状态模板的占位符

        .state('shell', {
        abstract: true,
        views: {
            "page-view": { template: '<div ui-view></div>' } // THIS IS WHERE THE CHILD (PAGE) VIEWS WILL BE RENDERED
            , "login-status-view": { template: '<div>This is the login status view</div>' }
            , "site-status-view": { template: '<div>This is the site status view</div>' }
            , "debug-view": { template: '<div>This is the debug view</div>' }
            }
    })
    .state('shell.home', {
        url: '/home',
        template: '<div class="purple">This is the home view</div>'
    })
    .state('shell.about', {
        url: '/about',
        template: '<div class="green">This is the about view</div>'
    })
    .state('shell.contact', {
        url: '/contact',
        template: '<div class="blue">This is the contact view</div>'
    })
    .state('shell.register', {
        url: '/register',
        template: '<div class="pink">This is the register view</div>'

    })
    .state('shell.login', {
        url: '/login',
        template: '<div class="orange">This is the login view</div>'
    })
    .state('shell.logout', {
        url: '/logout',
        template: '<div class="red">This is the logout view</div>'
    });

.state（'shell'{
摘要：没错，
观点：{
“页面视图”：{模板：'}//这是呈现子（页面）视图的位置
，“登录状态视图”：{模板：'这是登录状态视图'}
，“站点状态视图”：{模板：'这是站点状态视图'}
，“调试视图”：{模板：'这是调试视图'}
}
})
.state（'shell.home'{
url:“/home”，
模板：“这是主视图”
})
.state（'shell.about'{
url:“/关于”，
模板：“这是关于视图”
})
.state（'shell.contact'{
url:“/contact”，
模板：“这是联系人视图”
})
.state（'shell.register'{
url:“/register”，
模板：“这是注册表视图”
})
.state（'shell.login'{
url:“/login”，
模板：“这是登录视图”
})
.state（'shell.logout'{
url:“/logout”，
模板：“这是注销视图”
});

谢谢，我尝试了此操作，但未应用页面视图模板，并且在选择菜单链接以更改我获得的状态时：错误：无法在Object.v.transitiono（）处解析“关于”来自状态“”。此方法将起作用。把你的密码放在一个小盒子里，我会给你看的。谢谢。我没有将ui sref更改为包含shell。正如在Plunk中一样，ui sref应该是ui sref=“shell.about”

        .state('shell', {
        abstract: true,
        views: {
            "page-view": { template: '<div ui-view></div>' } // THIS IS WHERE THE CHILD (PAGE) VIEWS WILL BE RENDERED
            , "login-status-view": { template: '<div>This is the login status view</div>' }
            , "site-status-view": { template: '<div>This is the site status view</div>' }
            , "debug-view": { template: '<div>This is the debug view</div>' }
            }
    })
    .state('shell.home', {
        url: '/home',
        template: '<div class="purple">This is the home view</div>'
    })
    .state('shell.about', {
        url: '/about',
        template: '<div class="green">This is the about view</div>'
    })
    .state('shell.contact', {
        url: '/contact',
        template: '<div class="blue">This is the contact view</div>'
    })
    .state('shell.register', {
        url: '/register',
        template: '<div class="pink">This is the register view</div>'

    })
    .state('shell.login', {
        url: '/login',
        template: '<div class="orange">This is the login view</div>'
    })
    .state('shell.logout', {
        url: '/logout',
        template: '<div class="red">This is the logout view</div>'
    });