2016-12-16 17 views
0

blur-adminプロジェクトを変更して、独自のコントローラを持つログインページを追加しようとしています。UIルータ - 外部ログインページを設定する

私はdemoadmin.loginと呼ばれるページフォルダ内にコントローラフォルダを作成しました。 ログインはうまくいきましたが、今はスタンドアロンページとしてダッシュボードの外側に表示したいと考えています。

現在のところ、それは次のように表示されます。

enter image description here

しかし、私は外にそれを見せたい:

enter image description here

これは私の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); 
}); 

A ND私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を設定するにはどうすればよいですか?

答えて

1

$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 Insideは、yoがこのようなものを持っている必要があり、あなたのapp.htmlで

<div ui-view> 
</div> 

<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'); 
1

アプリケーションの抽象ビュー/状態を定義し、別の1つのビューをログインと定義します。このような何か:あなたのindex.htmlで

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