Question

我正在尝试修改blur-admin项目，添加一个带有自己控制器的登录页面。

所以我在名为demoadmin.login的页面文件夹中创建了一个控制器文件夹。登录运行良好，但现在，我想在仪表板外显示它，我的意思是作为独立页面。

目前它显示以下内容：

但我想在外面展示：

这是我的app.js文件：

'use strict';

angular.module('bluradmin', [
    'ngAnimate',
    'ui.bootstrap',
    'ui.sortable',
    'ui.router',
    'ngTouch',
    'toastr',
    'ui.slimscroll',
    'angular-progress-button-styles',
    'ngStorage',
    //'smart-table',
    //"xeditable",
    //'ngJsTree',

    'bluradmin.theme',
    'bluradmin.pages',
    'bluradmin.login'
]).run(function ($localStorage) {
    console.log($localStorage);
});

我的pages.module.js被修改了：

(function () {
    'use strict';

    angular.module('bluradmin.pages', [
        'ui.router',
        'bluradmin.pages.dashboard'
    ])
        .config(routeConfig);

    /** @ngInject */
    function routeConfig($urlRouterProvider, baSidebarServiceProvider) {
        $urlRouterProvider.otherwise('/login');
    }

})();

如何设置ui-router以获取此行为？

Answer 1

为App定义抽象视图/状态，并使用登录名定义另一个分离的视图。像这样：

$stateProvider
    .state('app', {
        url: '/',
        abstract: true,
        templateUrl: 'menu.html'
    })

    .state('app.home', {
        url: 'home',        
        views: {
            'page-view': {
                templateUrl: 'home.html',
            }
        }
    })

    .state('login', {
        url: '/login',
        templateUrl: 'login.html',
        }
    })

在menu.html中你应该有这样的东西：

<div ui-view="page-view"></div>

Answer 2

在index.html：

<div ui-view>
</div>

在你的app.html

 <div class="row main" ui-view>
 </div>

然后你的配置：

.config(function ($stateProvider, $urlRouterProvider) {


    $stateProvider

        .state('login', {
        url: '/login',
        templateUrl: 'templates/login.html',
    })

    .state('app', {
            url: '/app',
            templateUrl: 'templates/app.html'
        })

     .state('someOtherState', {
         parent: 'app',
         url: '/someUrl',
         templateUrl: 'templates/someTemplate.html'
     })

    $urlRouterProvider.otherwise('/login');

UI路由器 - 设置外部登录页面

2 个答案: