管理员 LTE 布局无法在带有 ui-router 的 Angular JS 中应用

【问题标题】：Admin LTE layout fails to apply in Angular JS with ui-router管理员 LTE 布局无法在带有 ui-router 的 Angular JS 中应用
【发布时间】：2018-02-03 01:47:15
【问题描述】：

我正在使用带有 ui-router 的 Admin LTE 主题和 Angular JS。问题是布局无法使用带有 ui-router 的 Angular JS 加载。这里存在一个问题

AdminLTE and AngularJS content wrapper wrong min-height

但我似乎无法理解如何解决这个问题。我研究了这个主题的 github repo，作者建议在我不知道的每个视图上应用 $.AdminLTE.layout.fix()。我已将此代码放入我的控制器中，但出现错误“$.AdminLTE 未定义”。任何帮助将不胜感激。

【问题讨论】：

标签： javascript css angularjs adminlte

【解决方案1】：

index.html 应该是这样的

<body ng-app="myApp" class="hold-transition skin-black sidebar-collapse sidebar-mini fixed">
    <!-- the app goes here -->
    <div class="wrapper" ng-controller="ApplicationCtrl" ui-view>
    </div><!-- ./wrapper -->
</body>

layout.html 应该是这样的

<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
    <section class="content">
        <div class="row" ui-view> </div>
    </section>
</div><!-- /.content-wrapper -->

你需要像这样配置路由映射

angular.module('myApp', [ 
    'ui.router'    
]).config(function ($stateProvider, $urlRouterProvider) {
      $stateProvider
        .state('layout', {
            abstract: true,
            templateUrl: 'layout.html'            
        })
        .state('layout.main', {
            url: '/',
            templateUrl: 'main.html',
            controller: 'MainCtrl'
        });

      $urlRouterProvider.otherwise('/');
});

【讨论】：