首页 > 解决方案 > ui-router:设置链接默认状态

问题描述

我想将默认状态设置为显示“仪表板”并在打开“127.0.0.1/mywebapp/”时激活“仪表板”链接。使用“$urlRouterProvider.otherwise('/dashboard');” 将完成这项工作,但我无法使用它,因为我将在第 404 页使用它。

这些是我的链接:

<ul class="nav-list">
    <li class="nav-item" ui-sref-active="active">
        <a ui-sref="dashboard" class="trans200">
            <i class="icon fas fa-columns"></i> 
            <span class="text">Dashboard</span>
        </a>
    </li>
    <li class="nav-item" ui-sref-active="active">
        <a ui-sref="agents" class="trans200">
            <i class="icon fas fa-user-tie"></i> 
            <span class="text">Agents</span>
        </a>
    </li>
    <li class="nav-item" ui-sref-active="active">
        <a ui-sref="projects" class="trans200">
            <i class="icon fas fa-box-open"></i> 
            <span class="text">Projects</span>
        </a>
    </li>
    <li class="nav-item" ui-sref-active="active">
        <a ui-sref="supplies" class="trans200">
            <i class="icon fas fa-parachute-box"></i> 
            <span class="text">Supplies</span>
        </a>
    </li>
</ul>

这是我当前的路由代码,但“默认”状态不会激活仪表板链接:

app.config(function($stateProvider,$locationProvider,$urlRouterProvider) {
    $locationProvider.hashPrefix('');
    $urlRouterProvider.otherwise('/404.htm');
    $stateProvider
    .state({
        name:'default',
        url:'',
        templateUrl: './views/dashboard.htm',
        controller:'dashboardCtrlr'
    })
    .state({ 
        name: 'dashboard',
        url: '/dashboard',
        templateUrl: './views/dashboard.htm',
        controller:'dashboardCtrlr'
    })
    .state({ 
        name: 'projects',
        url: '/projects',
        templateUrl: './views/projects.htm',
        controller:'projectsCtrlr'
    })
    .state({ 
        name: 'supplies',
        url: '/supplies',
        templateUrl: './views/supplies.htm',
        controller:'suppliesCtrlr'
    })
    .state({
        name: 'agents',
        abstract:true,
        default:'.list',
        url: '/agents',
        templateUrl: './views/agents.htm'
    })
// START OF AGENTS MODULE ROUTINGS
        .state({ 
            name: 'agents.list',
            url: '',
            templateUrl: './views/templates/agents/temp_agent_list.htm',
            controller: 'agentsCtrlr'
        })
        .state({ 
            name: 'agents.profile',
            url: '/{username}',
            templateUrl: './views/templates/agents/temp_agent_profile.htm',
            controller: 'agentProfileCtrlr'
        })
        .state({ 
            name: 'agents.create',
            url: '/{username}',
            templateUrl: './views/templates/agents/temp_agent_profile.htm',
            controller: 'agentProfileCtrlr'
        });
// END OF AGENTS MODULE ROUTINGS
});

标签: angularjsangular-ui-router

解决方案


尝试使用运行块:

app.run(function($window, $state) {
   if ($window.location.pathname === 'mywebapp/') {
       $state.go('dashboard');
   }
});

推荐阅读