0

我需要建立下一个层次结构：我的应用程序中有几个用户角色。我的应用程序界面由一个顶部导航栏组成，每个角色都有不同的选项卡。每个选项卡通常都有主从视图，其中显示了一些实体并默认加载第一个实体。

在努力进行身份验证之前（我发现了一些关于 http 拦截器等的文章），我想知道如何做最简单的事情：导航系统。

例如，假设我硬编码了我的用户角色，并且默认加载了管理员角色。我有一个顶部导航所在的 cp.html 文件。如果用户已登录，则当我转到“/”路由时，我应该使用管理选项卡将他重定向到 cp.html。如果用户没有登录，我应该将他重定向到“/登录”页面。

这是 cp.html 的示例：

<div class="navbar">
    <div class="navbar-inner">
        <ul class="nav">
            <li><a href="#/desktop">Desktop</a></li>
            <li><a href="#/companies">Companies</a></li>
            <li><a href="#/users">Users</a></li>
        </ul>
    </div>
</div>
<div ng-include src="include">
</div>

这是家庭（'/'）控制器：

function homeController($scope, $routeParams, $location) {
    if ($routeParams.tab) {
        $scope.include = '/templates/' + $routeParams.tab + '.html';
    } else {
        $scope.include = '/templates/companies.html';
    }
}

和主要的 app.js：

app.config(['$routeProvider', function($routeProvider) {

$routeProvider
    .when('/', {
        templateUrl: 'templates/cp.html',
        controller: homeController
    })

    .when('/:tab', {
        templateUrl: 'templates/cp.html',
        controller: homeController
    })

所以在这里取决于 :tab 参数，我可以包含不同的 .html 模板。但是如何处理控制器呢？假设我想去公司标签。我想拥有我的导航栏 + 公司内容。如果我单击公司选项卡，则包含该文件，但我留在 homeController。如果我使用 ng-controller 指令，那么我怎样才能获得公司的 id？在典型示例中，我们有 /companies/:companyId 路由。但是如果我在 routeProvider 中使用这条路线，那么我应该把什么作为 templateUrl？此外，当我点击公司选项卡时，我不会更改我的网址，只包含 company.html。

我完全对 AngularJS 中的嵌套视图和路由感到困惑。不过，我不想使用第三方库，试图自己弄清楚如何处理这个......

提前致谢

4

1 回答 1

0

看看有角的 ui-router，我认为这正是您正在寻找的。也试试他们的示例应用程序。

于 2013-05-03T08:13:39.890 回答